MVC 4 Razor 添加输入类型日期答案

【问题标题】：MVC 4 Razor adding input type dateMVC 4 Razor 添加输入类型日期
【发布时间】：2013-01-03 15:17:17
【问题描述】：

我想知道如何为我的模型的日期时间属性插入<input type="date"/>。至于现在 Razor 使用type="datetime" 创建一个普通的输入元素。我想利用 HTML5 的新输入类型。

【问题讨论】：

【解决方案1】：

输入日期值格式需要https://www.rfc-editor.org/rfc/rfc3339#section-5.6full-date指定的日期。

所以我最终做了：

<input type="date" id="last-start-date" value="@string.Format("{0:yyyy-MM-dd}", Model.LastStartDate)" />

我确实尝试过“正确”地使用：

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

与

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

不幸的是，似乎总是将输入的 value 属性设置为标准日期时间，所以我最终像上面一样直接应用格式。

编辑：

如果你使用的话，根据 Jorn 的说法

@Html.EditorFor(model => model.LastStartDate)

而不是 TextBoxFor 一切正常。

【讨论】：

+1 实际上，似乎使用属性上的这些数据注释，Html.EditorForm(m => m.LastStartDate) 呈现一个<input type=date>。因此，无需覆盖type 属性。
@JørnSchou-Rode 谢谢。不应该是 Html.EditorFor 吗？
@JørnSchou-Rode 我已根据您的评论更新了我的答案。
确实应该。 m 是一个错字:)
EditorFor从何而来？

【解决方案2】：

我设法通过使用以下代码来做到这一点。

@Html.TextBoxFor(model => model.EndTime, new { type = "time" })

【讨论】：

只是一个迟到的评论，为什么这个答案在 Chrome 中只显示时间？
Safari 或 IE 不支持输入类型日期。你用过这两种吗？来源：caniuse.com/#search=date
Html.EditorFor 应该使用 textboxfor

【解决方案3】：

 @Html.TextBoxFor(m => m.EntryDate, new{ type = "date" })

 or type = "time"

 it will display a calendar
 it will not work if you give @Html.EditorFor()

【讨论】：

【解决方案4】：

如果你想使用 @Html.EditorFor() 你必须使用 jQuery ui 和使用 NuGet 包管理器将您的 Asp.net Mvc 更新到 5.2.6.0。

@Html.EditorFor(m => m.EntryDate, new { htmlAttributes = new { @class = "datepicker" } })

@section 脚本 {

@Scripts.Render("~/bundles/jqueryval")

<script>

    $(document).ready(function(){

      $('.datepicker').datepicker();

     });

</script>

}

【讨论】：

【解决方案5】：

您将通过标签 type="date" 获取它...然后它将呈现漂亮的日历和所有...

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

【讨论】：