MVC 的日期选择器的 dd-mm-yyyy 格式在 Chrome 中不起作用

Question

在我用于输入出生日期的 MVC5 Razor 代码中，我使用了如下所示的日期选择器

    @Html.EditorFor(model => model.date_of_birth, 
new { htmlAttributes = new { @class = "m-wrap  datepicker" } })

此处 model.date_of_birth 正在调用 EditorFor 并使其成为 datepicker 和 @class = datepicker

然后使用以下代码在脚本区域启动日期选择器

 $('.datepicker').datepicker({
            format: 'yyyy-mm-dd',
            autoclose: true
        })

这里的日期格式是 'yyyy-mm-dd' 并且工作正常，但是用户希望它是 dd-mm-yyyy 格式。所以我将脚本中的格式更改为 dd-mm-yyyy 在 Internet Explorer 中，它工作正常，但在 Chrome 中，它在某个日期

中出现错误

eg:  14-05-2015

The field Date of Birth* must be a date.

日期 11-05-2015 在 chrome 中也工作正常。所以我猜 Chrome 正在采用 mm-dd-yyyy 中的日期格式。

格式 'dd-M-yyyy' 也能正常工作，只是 dd-mm-yyyy

出现错误

有什么方法可以克服这个浏览器特定的错误吗？

编辑

$.validator.addMethod('date', function (value, element) {
    if (this.optional(element)) {
        return true;
    }
    var valid = true;
    try {
        $.datepicker.parseDate('dd/mm/yyyy', value);
    }
    catch (err) {
        valid = false;
    }
    return valid;
});

$(function () {

 $('.datepicker').datepicker({
            format: 'dd/mm/yyyy',
            autoclose: true
        })
});

Answer 1

您可能需要在 web.config 中设置您的区域性，以便 .net 期望日期采用 dd-mm-yyyy 格式而不是默认的 mm-dd-yyyy US 格式。

例如

<configuration>
    <system.web>
        <globalization culture="en-AU" uiCulture="en-AU" />
    </system.web>
</configuration>

已更新

也尝试注释属性例如

[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd-MM-yyyy}")]
public DateTime date_of_birth;

Answer 2

对于非 'yyyy-MM-dd' 格式的日期，不显眼的验证器存在问题。类似的问题是here。

通过禁用日期验证解决

jQuery.validator.methods["date"] = function (value, element) { return true; }

或使用全球化。

在我的例子中，我总是将输入设置为只读并从 jquery.ui 添加日期选择器。本地化。

@Html.TextBoxFor(model => model.date_of_birth, 
    new { htmlAttributes = new { @class = "m-wrap  datepicker", @readonly="readonly" } })

和一些 js:

// include localization for datepicker

$( "#date_of_birth" )
    .datepicker( $.datepicker.regional[ "ru" ] )
    .datepicker({ dateFormat: 'dd-mm-yy' });

Answer 3

终于找到解决办法了。

首先，我创建了一个名为 jquery.validate.date.js 的新 java 脚本文件其中包含以下代码

$(function () {
    $.validator.methods.date = function (value, element) {
        if ($.browser.webkit) {
            var d = new Date();
            return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
        }
        else {
            return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
        }
    };
});

它覆盖了 jquery.validate.js

中的日期验证函数

然后我在 'jquery.validate.js' 之后调用脚本，如下所示

<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.val.js")"/>

<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.val.date.js")"/>

现在日期格式 dd/mm/yyyy 在 chrome 和 IE 中都可以正常工作。

MVC 的日期选择器的 dd-mm-yyyy 格式在 Chrome 中不起作用

dd-mm-yyyy format for datepicker of MVC is not working in Chrome

asp.net-mvc

datepicker