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

本文关键字:日期 TextBoxFor 类型 何使用 Html 输入 | 更新日期: 2023-09-27 18:16:13

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

@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。

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

试试这个;

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

设置值时必须处理null

如果你可以改变Model,你可以试试这个;

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

,在您的视图中,您可以使用EditorFor helper。

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

模型设计:

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

View Design:

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

我对EditorFor和boostrap-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>

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

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