该字段必须是日期 - Chrome中的DatePicker验证失败 - mvc

Question

我有奇怪的问题.我的日期验证在Chrome中不起作用.我试过这个答案,但它对我不起作用.

我的模型中有这个:

[Display(Name = "Date")]
[DataType(DataType.Date)]
public DateTime Date { get; set; }

我的看法:

<div class="editor-field">
@Html.TextBoxFor(model => model.Item.Date, new { @class = "picker" })
@Html.ValidationMessageFor(model => model.Item.Date)
</div>

$(document).ready(function () {
    $('.picker').datepicker({
        dateFormat: 'dd.mm.yy',
        changeMonth: true,
        changeYear: true,
        selectOtherMonths: true
    });
});

一切都适用于Opera和Firefox,但Chrome不喜欢这种类型的日期.我经常收到以下错误The field 'Date' must be a date.

有任何想法吗？

UPDATE

当代码在局部视图中时,似乎存在问题.当我将该代码复制到主页时,验证工作正常.

我正在我的主视图中插入局部视图,就像这样:

@Html.Partial("_CreateOrEdit", Model)

上面的代码在局部视图中:

@model Pro.Web.Models.Model

<div class="editor-field">
@Html.TextBoxFor(model => model.Item.Date, new { @class = "picker" })
@Html.ValidationMessageFor(model => model.Item.Date)

$(document).ready(function () {
$('.picker').datepicker({
    dateFormat: 'dd.mm.yy',
    changeMonth: true,
    changeYear: true,
    selectOtherMonths: true
});

</script>
});

UPDATE2

它毕竟不起作用.有时它有效,有时不行.我在日期上点击了几次,有时候验证通过.对于同一天,可能会有正确的验证.

这是日期字段的输出html:

<div class="editor-field">
<input class="picker" data-val="true" data-val-date="The field Date must be a date." data-val-required="The Date field is required." id="date" name="Item.Date" type="text" value="1.1.0001. 0:00:00" />
<span class="field-validation-valid" data-valmsg-for="Item.Date" data-valmsg-replace="true"></span>
</div>

Answer 1

这里的情况完全相同(局部视图)

我通过删除验证属性并在服务器端执行验证来解决它:

$('#date').removeAttr("data-val-date");

Answer 2

在我看来,问题是MVC正在生成日期HTML5输入[type=date].这导致chrome有效日期格式与系统日期格式相同.

您可以使用以下属性在MVC中将日期格式设置为与JqueryUI相同:

[DataType(DataType.Date), DisplayFormat( DataFormatString="{0:dd.MM.yy}", ApplyFormatInEditMode=true )]

第二个想法是使用文章中的代码:使用回退到jQuery UI创建本机HTML 5 Datepicker

还有一件事.在html输入中有一个关于日期的好主题:有没有办法改变输入类型="日期"格式？

Answer 3

我通过删除验证属性解决了这个问题

@model Pro.Web.Models.Model

<div class="editor-field">
@{ Html.EnableClientValidation(false); }
@Html.TextBoxFor(model => model.Item.Date, new { @class = "picker" })
@Html.ValidationMessageFor(model => model.Item.Date)
@{ Html.EnableClientValidation(true); }