dd-mm-yyyy Google Chrome 的日期验证错误 [重复]

Question

我正在开发一个 ASP.NET MVC4 应用程序。

我的视图模型类属性

[DisplayName("Birth Date")]
        [Required(ErrorMessage = "You must indicate your full birthday")]
        [DataType(DataType.Date), DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yyyy}")]
        public DateTime BirthDate { get; set; }

Javascript 代码

var dt = new Date();
    $(function () {
        $("#BirthDate").datepicker({
            showOn: "button",
            buttonImage: "@Url.Content("~/Content/themes/base/images/calendar.gif")",
            buttonImageOnly: true,
            dateFormat: 'dd/mm/yy',
            changeMonth: true,
            changeYear: true,
            yearRange: '1980:dt'
        });
    });

查看代码

<div class="block">
                    @Html.LabelFor(model => model.BirthDate, new { @Class = "compel" })
                    @Html.TextBoxFor(model => model.BirthDate)
                </div>

当我在 IE 和 Mozilla Firefox 中运行该应用程序时，它运行良好，但使用 google chrome 时，它​​会给出验证错误，因为 24/12/2012 的值对于出生日期无效。

请帮我解决这个问题。

Answer 1

似乎 IE 和 Firefox 使用与 OS 相同的格式，而 Chrome 没有，这有时会导致日期验证出现问题。

也许这会解决你的问题：Unobtrusive validation in Chrome won't validate with dd/mm/yyyy

Answer 2

解决我所做的问题：

1. 添加对脚本 datepicker-fr.js 的引用（可以找到 这里https://github.com/jquery/jquery-ui/tree/master/ui/i18n)。

2. 创建一个函数并将其添加到我的自定义 javascript 文件中：

    function extendJQueryDateValidation() {
   
   // fix date validation for chrome
   jQuery.extend(jQuery.validator.methods, {
       date: function (value, element) {
           var isChrome = window.chrome;
           // make correction for chrome
           if (isChrome) {
               var d = new Date();
               return this.optional(element) ||
               !/Invalid|NaN/.test($.datepicker.parseDate("dd/mm/yy", value));
           }
               // leave default behavior
           else {
               return this.optional(element) ||
               !/Invalid|NaN/.test(new Date(value));
           }
       }
   });
   }
   

   参考http://devdens.blogspot.com/2011/11/jquery-validation-fix-for-date-format_29.html

3. 在我有日期输入元素的页面中：

           $(function () 
        {          
         extendJQueryDateValidation();        
         $.datepicker.setDefaults($.datepicker.regional   ["fr"]);    
                  $("#dateField").datepicker(
       { yearRange: "1980:2015", 
    dateFormat: "dd/mm/yy", 
    changeMonth: true, 
    changeYear: true });
   
              });
   

Answer 3

你可以试试这个日期格式： 示例：“1999 年 12 月 31 日”

 jQuery.extend(jQuery.validator.methods, {
        date: function (value, element) {
            return /^(?:(?:31(\/|-|\.)(?:0?[13578]|1[02]))\1|(?:(?:29|30)(\/|-|\.)(?:0?[1,3-9]|1[0-2])\2))(?:(?:1[6-9]|[2-9]\d)?\d{2})$|^(?:29(\/|-|\.)0?2\3(?:(?:(?:1[6-9]|[2-9]\d)?(?:0[48]|[2468][048]|[13579][26])|(?:(?:16|[2468][048]|[3579][26])00))))$|^(?:0?[1-9]|1\d|2[0-8])(\/|-|\.)(?:(?:0?[1-9])|(?:1[0-2]))\4(?:(?:1[6-9]|[2-9]\d)?\d{2})$/.test(value);
        }
    });

Answer 4

我搜索了这个并在这里和其他地方发现了多个问题。我找到了一个简单的解决方案，也想与未来的搜索者分享；

https://stackoverflow.com/a/36903550/1997092

我发现这个错误最简单的更正方法是下面的代码 调用验证文件后的 sn-p；

jQuery.validator.methods["date"] = function (value, element){
    var shortDateFormat = "dd/mm/yy";
    var res = true;
    try {
        $.datepicker.parseDate(shortDateFormat, value);
    } catch (error) {
        res = false;
    }
    return res;
}

即使在 2016 年发现的版本中，如果没有 以上代码在 Chrome 而不是 Firefox 中。

这是我的首选解决方案，因为它不需要任何额外的 库或插件工作。

我在这里搜索问题时发现了这段代码 sn-p。

希望对某人有所帮助。