MVC Entity Framework中DateTime字段带时分的选择器实现问题

我之前也碰到过一模一样的情况——用VS2017的脚手架自动生成Controller和View后，DateTime字段只能手动输入，加了[DataType(DataType.DateTime)]也没触发日期时间选择器，改了DisplayFormat又只能选日期不能调时分。其实问题出在HTML5原生datetime-local输入框的格式要求和脚手架生成的View标记上，下面是亲测有效的解决步骤：

1. 修正实体类的属性标记 #

HTML5的datetime-local输入框要求值的格式是yyyy-MM-ddTHH:mm（日期和时间用T分隔），所以需要给你的字段同时设置正确的DataType和DisplayFormat：

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

这里的关键是DataFormatString里的THH:mm，它会告诉MVC把时间格式化为符合datetime-local要求的格式，同时ApplyFormatInEditMode = true确保在编辑模式下也应用这个格式。

2. 确保View生成正确的输入类型 #

有时候脚手架自动生成的EditorFor可能没有明确指定输入类型，导致浏览器不触发日期时间选择器。你需要手动在View里给输入框指定type="datetime-local"：

如果用EditorFor：

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

如果用TextBoxFor（更直接）：

@Html.TextBoxFor(model => model.EnrollmentDate, "{0:yyyy-MM-ddTHH:mm}", new { @class = "form-control", type = "datetime-local" })

这样设置后，现代浏览器（Chrome、Edge、Firefox等）会自动渲染出带日期和时间选择的原生控件，既能选日期，也能调整小时和分钟。

补充说明 #

• 如果你的项目需要兼容旧浏览器（比如IE），原生datetime-local可能不支持，这时候可以考虑用第三方插件（比如jQuery UI的DateTimePicker），但原生方案在现代浏览器里体验最好。
• 不要只单独用[DataType(DataType.DateTime)]，MVC默认不会自动把它映射为datetime-local输入框，必须配合正确的DisplayFormat和View里的类型指定。

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