ASP MVC 4客户端验证在IE中不起作用(在Chrome中起作用）

ASP MVC 4 client side validation not working in IE (works in Chrome)

本文关键字：不起作用 Chrome 起作用 IE MVC 客户端 验证 ASP      更新时间：2023-09-26

我在Stack Overflow上看到过类似的问题，但没有具体针对这种情况。无论出于何种原因，ASP.Net MVC 4客户端验证在Chrome中运行良好，但在IE9中不会启动。

Web.config

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

查看

任何东西都可以输入到这两个字段中，它们将被发布回服务器。例如，55/55/5555会在Chrome中触发错误并阻止表单发布，但在IE中，表单会将数据发送回服务器并使网站崩溃。。。

下面是应用于每个字段的jquery输入掩码和Razor语法。

$('#EffectiveDate').mask('99/99/9999');
$('#Birthdate').mask("99/99/9999");
<div class="M-editor-label">
    @Html.LabelFor(model => model.EffectiveDate, new {@class="required"})
</div>
<div class="M-editor-field">          
    @Html.TextBoxFor(model => model.EffectiveDate, new { maxlength = 10 })
    @Html.ValidationMessageFor(model => model.EffectiveDate)
</div>
<div class="M-editor-label">
    @Html.LabelFor(model => model.Birthdate, new {@class="required"})
</div>
<div class="M-editor-field">
    @Html.EditorFor(model => model.Birthdate)
    <br />
    @Html.ValidationMessageFor(model => model.Birthdate)
</div>

Layout.cshtml

以下是渲染脚本部分

<script src="/Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.10.4.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
<script src="/Scripts/typeahead.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.dataTables.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.numeric.js" type="text/javascript"></script>
<script src="/Scripts/jquery.fancybox.js" type="text/javascript"></script>
<script src="/Scripts/jquery.fancybox.pack.js" type="text/javascript"></script>

型号

    [DisplayName("Effective Date")]
    [DisplayFormat(DataFormatString = "{0:d}", ApplyFormatInEditMode = true)]
    public DateTime? EffectiveDate { get; set; }
    [DisplayName("Date of Birth")]
    [DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}", ApplyFormatInEditMode = true)]
    public DateTime? Birthdate { get; set; }

请查看工作示例https://dotnetfiddle.net/fEER2v

问题出在日期本地化和jQuery验证插件中。最简单的修复方法是覆盖date验证器。这是使用moment.js javascript库的示例代码：

  $.validator.methods.date = function (value, element) {
       return value === "" || moment(value, "MM/DD/YYYY", true).isValid();
  };

它也可通过NuGet 获得

当然，您需要一些优化，比如从元素属性中获取日期格式。

相关文章：