28

我正在做一个简单的 MVC4 Internet 应用程序，它允许将一些项目添加到类别中。

这是我到目前为止所做的。

我在 mvc 视图中有一个日期选择器。日期选择器的脚本是这样的。

<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.min.js")" type="text/javascript"></script>
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
    $(function () {
        $('#dtItemDueDate').datepicker({
            dateFormat: 'dd/mm/yy',
            minDate: 0
        });
    });
</script>

我的模型属性：

        [DisplayName("Item DueDate")]
        [Required]
        [DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}",ApplyFormatInEditMode = true)]
        [DataType(DataType.DateTime)]
        public DateTime? dtItemDueDate { get; set; }
        public char charCompleted { get; set; }

在我看来，我已经这样做了：

@Html.TextBoxFor(m => m.dtItemDueDate)
@Html.ValidationMessageFor(m => m.dtItemDueDate)

错误是这样的：

The field Item DueDate must be a date.

奇怪的是它在 IE 和 mozilla 中工作，但在 Chrome 中不工作。

我在 SO 上找到了很多帖子，但没有一个有帮助

有什么想法/建议吗？

4

6 回答 6

48

在不更改 jquery.validate.js 的情况下，您可以使用以下代码片段$(document).ready()：

jQuery.validator.methods.date = function (value, element) {
    var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
    if (isChrome) {
        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));
    }
};
于 2013-12-20T01:38:18.240 回答
30

编者注：此答案不再有效，从 jQuery 1.9 (2013) 开始，该$.browser方法已被删除

根据这篇文章，这是基于 Webkit 的浏览器的一个已知怪癖。

一种解决方案是jquery.validate.js通过查找函数进行修改date: function (value, element)并将此代码放入其中：

if ($.browser.webkit) {
    //ES - Chrome does not use the locale when new Date objects instantiated:
    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));
}
于 2013-03-29T16:31:12.943 回答
8

Rowan Freeman 解决方案对我不起作用，因为.toLocaleDateString(value)它不解析value字符串

这是我想出的解决方案 => 在 jquery.validate.js 中找到这个函数定义：“日期：函数（值，元素）”并将代码替换为：

// http://docs.jquery.com/Plugins/Validation/Methods/date
date: function (value, element) {
    var d = value.split("/");
    return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value));
},
于 2013-07-31T10:56:18.077 回答
8

以下是可能有助于修复 chrome 和 safari 中的日期选择器问题的工作代码：模型：

public DateTime? StartDate { get; set; }

看法：

@Html.TextBoxFor(model => model.StartDate, "{0:dd/MM/yyyy}", new { @type = "text", @class = "fromDate" })

js：

$(function () {
    checkSupportForInputTypeDate();

    $('#StartDate').datepicker({        
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd/mm/yy'
    });    
});

//Function to configure date format as the native date type from chrome and safari browsers is clashed with jQuery ui date picker.
function checkSupportForInputTypeDate() {
    jQuery.validator.methods.date = function (value, element) {
        var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
        var isSafari = /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor);
        if (isSafari || isChrome) {
            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));
        }
    };
}
于 2014-04-10T09:49:11.987 回答
7

以下是Maxim Gershkovich 的解决方案详细说明：

jQuery.validator.methods.date = function (value, element) {
    if (value) {
        try {
            $.datepicker.parseDate('dd/mm/yy', value);
        } catch (ex) {
            return false;
        }
    }
    return true;
};

备注：

  • 这取决于jQuery UI 附带的jQuery datepicker方法

  • 这实际上比 jQueryValidate 附带的本机日期验证更强大。

    根据有关日期验证的文档：

    如果值是有效日期，则返回 true。使用 JavaScript 的内置 Date 来测试日期是否有效，因此不进行健全性检查。只有格式必须有效，而不是实际日期，例如 30/30/2008 是有效日期。

    而parseDate将检查日期是否有效且实际存在。

于 2015-01-21T22:04:57.993 回答
0

我通过从DateTime更改为String解决了这个问题。

这是我目前能想到的最佳维护解决方案。

于 2015-04-15T16:55:33.160 回答