如何修复 mvc 中日期时间属性上的“字段必须是日期”
Posted
技术标签:
【中文标题】如何修复 mvc 中日期时间属性上的“字段必须是日期”【英文标题】：how to fix 'The field must be a date' on a datetime property in mvc 【发布时间】：2015-08-11 04:15:35 【问题描述】：我需要为我的模型属性捕获日期和时间。在我的模型类中，我有以下内容
[Required]
[DataType(DataType.DateTime)]
public DateTime? CallBackDate get; set;
当我输入有效的日期时间（例如28/05/2015 15:55）时，我不断收到此错误The field CallBackDate must be a date.
我看到了类似的问题并尝试了各种答案，但似乎没有什么能摆脱这个。我正在使用不显眼的客户端验证，但我无法禁用它。
输入字段的来源有以下标记
<input autocomplete="off" class="jquery_datetimepicker form-control hasDatepicker" data-val="true" data-val-date="The field CallBackDate must be a date." data-val-required="The CallBackDate field is required." id="CallBackDate" name="CallBackDate" placeholder="Enter your CallBackDate" type="text" value="">
并且 jquery 日期时间选择器具有以下标记
$('.jquery_datetimepicker').datetimepicker(
dateFormat: 'dd/mm/yy',
minDate: 0,
showWeeks: true,
showStatus: true,
highlightWeek: true,
numberOfMonths: 1,
showAnim: "scale",
showOptions:
origin: ["top", "left"]
,
timeFormat: 'hh:mm tt'
);
有什么想法吗？谢谢
【问题讨论】：
Jquery Datepicker Chrome 的可能重复项这似乎是客户端验证的一个已知问题。 @Coulton 这绝对不是 chrome 或浏览器问题 你看答案了吗？该问题的解决方案并非特定于chrome，解决方案是修改jquery.validate的行为。您说错误是由客户端验证引起的？ 是的，我确实看过问题和答案，但它不相关！ 您可以根据this answer 修改验证器 - 但取决于您使用的日期选择器 【参考方案1】：由于 jquery.validate.unobtrusive.min.js 中的 MVC 错误（甚至在 MVC 5 中）可能会出现客户端验证问题，该错误不接受任何日期/日期时间格式。它不是由日期选择器或浏览器引起的。不幸的是，您必须手动解决它。
我的最终解决方案：
之前必须包含：
@Scripts.Render("~/Scripts/jquery-3.1.1.js")
@Scripts.Render("~/Scripts/jquery.validate.min.js")
@Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js")
@Scripts.Render("~/Scripts/moment.js")
您可以使用以下方式安装 moment.js：
Install-Package Moment.js
然后你终于可以为日期格式解析器添加修复：
$(function ()
$.validator.methods.date = function (value, element)
return this.optional(element) || moment(value, "DD.MM.YYYY", true).isValid();
);
【讨论】：
工作完美，谢谢。我只需要将格式更改为“DD/MM/YYYY”。 嗨，@lukyer，您的代码运行良好，但是当我将它与我的 MinAge 属性客户端验证结合使用时，我的 MinAge 验证变得不起作用。您对如何使这两种验证起作用有想法吗？我在这里发布了详细信息：***.com/questions/56629714/… 对于荷兰语的 DateTime，包括我不得不稍微改变格式的时间：D-M-YYYY HH:mm:ss。我希望将来 asp.net mvc 将使与其他语言环境的处理更加简单，这样我们就不必花几个小时去谷歌了。
我遇到了类似的问题，我也发布了这个问题：***.com/questions/61114448/… 我已经尝试使用您建议的解决方案，并且在调用函数来修复日期格式解析器时，我添加了一个调试器并且函数（值，元素），即值和元素参数显示为未定义。您能否提出相同的建议，我是否遗漏了什么或者我需要为参数传递一些适当的值？
我将日期格式更改为 yyyy-mm-dd - 修复了它，只是一个更好的日期格式。世界应该切换到这个。【参考方案2】：
我添加了日期格式解析器的修复，但我需要将格式设置为“L”，以便它可以在所有区域设置中工作：
$(function ()
$.validator.methods.date = function (value, element)
return this.optional(element) || moment(value, "L", true).isValid();
);
【讨论】：
【参考方案3】：以模型为例：
[Display(Name = "Insert Start Date")]
[Required(ErrorMessage = "You must specify the date of the event!")]
[DataType(DataType.DateTime, ErrorMessage = "Podaj prawidłową datę wydarzenia")]
[DisplayFormat(DataFormatString = "0:yyyy-MM-dd HH:mm", ApplyFormatInEditMode = true)]
public DateTime StartDate get; set;
[Display(Name = "Insert End Date")]
[Required(ErrorMessage = "You must specify the date of the event!")]
[DataType(DataType.DateTime, ErrorMessage = "Podaj prawidłową datę wydarzenia")]
[DisplayFormat(DataFormatString = "0:yyyy-MM-dd HH:mm", ApplyFormatInEditMode = true)]
public DateTime EndDate get; set;
并查看我的示例代码：
<script>
$('#startDate').datetimepicker(
onClose: function (dateText, inst)
var endDateTextBox = $('#endDate');
if (endDateTextBox.val() != '')
var testStartDate = new Date(dateText);
var testEndDate = new Date(endDateTextBox.val());
if (testStartDate > testEndDate)
endDateTextBox.val(dateText);
else
endDateTextBox.val(dateText);
, dateFormat: 'yy-mm-dd',
onSelect: function (selectedDateTime)
var start = $(this).datetimepicker('getDate');
$('#endDate').datetimepicker('option', 'minDate', new Date(start.getTime()));
); ....
这带来了积极的影响： dateFormat: 'yy-mm-dd',
【讨论】：
here 是另一个可行的解决方案，希望有所帮助。【参考方案4】：$(function ()
$.validator.addMethod('date',
function (value, element)
if (this.optional(element))
return true;
var valid = true;
try
$.datepicker.parseDate('dd/mm/yy', value);
catch (err)
valid = false;
return valid;
);
$(".datetype").datepicker( dateFormat: 'dd/mm/yy' );
);
将此代码放在文件 datepicker.js 中，并将此文件包含在 html 中
【讨论】：
【参考方案5】：您需要确保您的应用程序的Culture 设置正确。
示例
以下示例显示文化如何影响日期解析：https://dotnetfiddle.net/vXQTAZ
DateTime dateValue;
string dateString = "28/05/2015 15:55";
if (DateTime.TryParse(dateString, CultureInfo.CreateSpecificCulture("en-US"), DateTimeStyles.None, out dateValue))
Console.WriteLine("Valid en-US date.");
else
Console.WriteLine("Not a valid en-US date.");
if (DateTime.TryParse(dateString, CultureInfo.CreateSpecificCulture("fr-FR"), DateTimeStyles.None, out dateValue))
Console.WriteLine("Valid fr-FR date.");
else
Console.WriteLine("Not a valid fr-FR date.");
输出
Not a valid en-US date.
Valid fr-FR date.
客户端设置
您可能还需要确保您的客户端验证器使用正确的文化/全球化。如果您在 MVC 中使用 jQuery 验证插件，请参阅此扩展以帮助修改该插件以满足您的需求：http://blog.icanmakethiswork.io/2012/09/globalize-and-jquery-validate.html
【讨论】：
更新了答案以包括对客户端验证器的必要更改。【参考方案6】：我必须验证dd/mm/yyyy hh:ii 并在@lukyer 的帮助下添加了答案
DD/MM/YYYY HH:mm 工作正常
希望对您有所帮助！
【讨论】：
【参考方案7】：我无法通过其他答案来解决它。就我而言，使用 TextBoxFor 不是强制性的。我改用了 TextBox。
型号
[Required(ErrorMessage = "Required")]
[DisplayFormat(DataFormatString = "0:dd/MM/yyyy", ApplyFormatInEditMode = true)]
public DateTime MyDateget;set;
查看
@Html.TextBox("MyDate", DateTime.Now.ToString(), new @type="datetime")
【讨论】：
【参考方案8】：-
在 additional-methods.js 文件中添加以下方法，并将此文件包含在您的项目中：
$.validator.addMethod('date', function (value, element) if (this.optional(element)) return true; var valid = true; try $.datepicker.parseDate('dd/mm/yy', value); catch (err) valid = false; return valid; );
-
视图必须是这样的：
@Html.TextBoxFor(model => model.DOB, new @class = "datetype", type ="text" )
@Html.ValidationMessageFor(model => model.DOB)
$(function ()
$(".datetype").datepicker( dateFormat: 'dd/mm/yy' );
);
它对我有用。
【讨论】：
【参考方案9】：本地化或 moment.js 在使用 datetimepicker 时对我不起作用。拆分小时，然后检查正在工作。我在用 格式：'dd.mm.yyyy hh:ii' 用于日期时间选择器。
$.validator.methods.date = function (value, element)
var dateL = value.split(" ");
var date = dateL[0].split(".");
var hour = dateL.length > 1 ? dateL[1].split(":") : "";
return this.optional(element) || !/Invalid|NaN/.test(dateL.length > 1 ? new Date(date[2], date[1], date[0],hour[0],hour[1]).toString() : new Date(date[2], date[1], date[0]).toString());
【讨论】：
【参考方案10】：如果您使用 JQuery 不显眼的验证，您可以添加后面的规则并更改客户端验证消息。
$('#inputName').rules('add',
messages:
date:'Invalid format date'
)
【讨论】：
【参考方案11】：在我的模型中，我有：
[DisplayFormat(DataFormatString = "0:dd MMM yyyy", ApplyFormatInEditMode = true)].
在我的脚本中，我有：
$(function ()
$('.datepicker').datepicker(
changeMonth: true,
changeYear: true,
format: "dd MMM yyyy"
);
);当我将脚本的格式更改为格式时：dd M yyyy - 它起作用了。
【讨论】：
问题是关于日期时间选择器而不是日期选择器【参考方案12】：这对我在客户端和服务器端都有效，我也安装了 moment.js。
$("#datepicker").datepicker();
$('#datepicker').datepicker("option", "dateFormat", "dd/mm/yy");
$.validator.methods.date = function (value, element)
return this.optional(element) || moment(value, "DD/MM/YYYY", true).isValid();
【讨论】：
【参考方案13】：-
安装moment.js（安装包Moment.js）
打开jquery.validate.js，找到方法date:function(value, element)
为此替换内容：
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
return this.optional(element) || (isChrome ? moment(value, 'L').isValid() : !/Invalid|NaN/.test(new Date(value)));
【讨论】：
不建议更改库代码。如果您使用包管理器并安装最新版本，这将被清除以上是关于如何修复 mvc 中日期时间属性上的“字段必须是日期”的主要内容，如果未能解决你的问题，请参考以下文章
如何绑定到列表作为 MVC 3 Razor 中模型上的属性？
如何从 C# 控制器（OData）的 JSON 序列化中修复丢失的子对象（导航属性）？
将应用程序发布到 IIS 时，如何在 MVC 中以 dd/mm/yyyy 格式绑定日期时间？