ASP.NET MVC中如何让@Html Helper生成type为date的输入框

方案1：给模型字段加数据注解（最推荐，全局生效） #

这是最符合ASP.NET MVC设计规范的实现方式，在你的模型类的StartDate字段上添加DataType和配套的DisplayFormat注解即可，Html Helper会自动识别注解，生成type="date"的输入框：

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

加完注解后原有EditorFor代码不需要任何修改，就可以自动渲染出支持原生日期选择器的输入框，不需要额外传type参数。

方案2：直接在EditorFor参数中指定type属性（无侵入，不需要改模型） #

如果不想修改模型代码，可以直接在htmlAttributes里指定@type="date"，这是框架原生支持的写法，比修改生成后的HTML要优雅得多：

@Html.EditorFor(model => model.StartDate, new { 
    htmlAttributes = new { @class = "form-control", @type = "date" } 
})

方案3：自定义日期编辑器模板（适合全局统一管控样式） #

如果你的项目中大量用到日期选择框，可以自定义全局编辑器模板，一劳永逸：

1. 在项目路径Views/Shared/EditorTemplates下新建Date.cshtml文件
2. 模板内添加如下代码：

@model DateTime?
@{
    var fieldName = ViewData.TemplateInfo.HtmlFieldPrefix;
    var value = Model.HasValue ? Model.Value.ToString("yyyy-MM-dd") : "";
}
<input type="date" class="form-control" name="@fieldName" id="@fieldName" value="@value" />

3. 后续使用时要么给模型加[DataType(DataType.Date)]注解自动调用模板，要么手动指定模板名：

@Html.EditorFor(model => model.StartDate, "Date")

注意事项 #

HTML原生date类型的输入框要求值格式必须为yyyy-MM-dd，所以一定要确保传给输入框的初始值是该格式，否则初始值会无法正常显示。

内容的提问来源于stack exchange，提问作者Martin Vaughan