如何使用输入类型=日期的Html.TextBoxFor?

时间:2014-08-01 18:57:41

标签: c# asp.net-mvc html5 input

我想在我的代码中实现。为此,我有以下内容:

@Html.TextBoxFor(model => model.CreationDate, new { @type = "date" })

此代码生成以下HTML:

<input data-val="true" data-val-date="The field CreationDate must be a date." 
             data-val-required="The CreationDate field is required." 
             id="CreationDate" name="CreationDate" type="date" 
             value="09/05/2012 15:02:19">

该值未显示在网页上,因为type =“date”需要YYYY-MM-DD格式的数据。

我已尝试格式化日期,但当然会爆炸。

@Html.TextBoxFor(model => model.CreationDate.ToString("YYYY-MM-DD"), 
                 new { @type = "date" })

如何使用TextBoxFor方法正确显示构造? 或者我应该使用其他方法(我已经尝试过EditorFor但是失败了)?

CreationDate的类型为DateTime。

4 个答案:

答案 0 :(得分:50)

试试这个;

@Html.TextBoxFor(model => model.CreationDate,
           new { @type = "date", @Value = Model.CreationDate.ToString("yyyy-MM-dd") })

设置值时,您必须处理null

OR

如果您可以更改Model,可以试试这个;

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public DateTime CreationDate{ get; set; }

在您的视图中,您可以使用EditorFor帮助程序。

@Html.EditorFor(model => model.CreationDate, new { @type = "date" })

答案 1 :(得分:3)

模型设计:

[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public DateTime CreationDate{ get; set; }

查看设计:

<%: Html.EditorFor(m => m.CreationDate, new { @type = "date" }) %>

答案 2 :(得分:0)

我已经使用EditorFor和bootstrap-datepicker库做了类似的事情:

    <div class="input-prepend date" id="startDate" data-date=@DateTime.UtcNow data-date-format="m/d/yyyy">
        <span class="add-on"><i class="icon-calendar"></i></span>
        @Html.EditorFor(m => m.StartDate)            
    </div>

答案 3 :(得分:-1)

将c#Datetime转换为HTML-5日期值

<input type="date" value="<%= SomeFieldDate.ToString("yyyy-MM-dd")%>"/>