Jquery dd/MM/yyyy日期格式验证

6

我在我的应用程序中使用默认的ASP.NET MVC 4验证包。在视图中,我有一个日期字段,格式为“dd/MM/yyyy”,但jQuery验证无法验证该格式。然后我添加了以下代码来覆盖默认行为。

$(function () {
        $.validator.methods.date = function (value, element) {
            Globalize.culture("en-GB");
            // you can alternatively pass the culture to parseDate instead of
            // setting the culture above, like so:
           // parseDate(value, null, "en-AU")
            return this.optional(element) || Globalize.parseDate(value) !== null;
        }
    });

日期验证问题已经解决,现在我的应用不再触发客户端验证,而是进行服务器端验证。这种行为的原因可能是什么?


它绝对没有触发客户端验证,还是在验证过程中产生了JavaScript错误,从而未能将POST标记为无效,因此继续调用服务器? - Snixtor
6个回答

12

在stackoverflow上找到了一个对我来说更简单的解决方案:

Clientside validation fails for date format dd/mm/yyyy in jQuery Validate

我喜欢它,因为我不需要新的第三方脚本或任何额外的插件。

基本上只需像这样覆盖验证方法:

$(document).ready(function () {
    $.validator.methods.date = function(value, element) {
        return this.optional(element) || parseDate(value, "dd-MM-yyyy") !== null;
    };
});

1
不确定parseDate是从哪里来的,但你可以使用date.js和这个Date.parseExact(value, "d/M/yyyy")代替它。但是因为让我走上了正确的道路,所以加一分。 - Richard Housham
以前是使用jQuery.datepicker.parseDate - Dai Bok

6

2

缺少globalize.js文件。我修改了以下代码,现在正常工作。

https://github.com/jquery/globalize下载文件。

包含对相关.js文件的引用(您也可以使用NuGet软件包进行安装,这是我使用的选项。)

<script src="~/Scripts/globalize/globalize.js"></script>
<script src="~/Scripts/globalize/cultures/globalize.culture.en-GB.js"></script>

$(document).ready(function () {
        $.culture = Globalize.culture("en-GB");
        $.validator.methods.date = function (value, element) {
            //This is not ideal but Chrome passes dates through in ISO1901 format regardless of locale 
            //and despite displaying in the specified format.

            return this.optional(element)
                || Globalize.parseDate(value, "dd/MM/yyyy", "en-GB")
                || Globalize.parseDate(value, "yyyy-mm-dd");
        }
    });

1
您可以使用以下代码进行验证:

    jQuery.validator.addMethod("validdate", function(value, element) {
       return this.optional(element) ||  /^\d{1,2}\/\d{1,2}\/\d{4}$/.test(value);
    }, "Please enter valid date.");

请根据您的代码使用 $ 或 jQuery。 在这里,您只需要在jQuery代码中添加规则,并让其使用validdate来验证您的自定义规则。


1

谢谢Dai。不得不使用date.js库中类似的东西。请参见下面:

$.validator.methods.date = function(value, element) { 
  return this.optional(element) || Date.parseExact(value, "dd-MM-yyyy"); 
};

0

我更喜欢使用MM/dd/yyyy格式,并使用jQuery的相同验证方式。如果您覆盖jQuery日期验证,则可以完美地工作。

$.validator.methods.date = function (value, element) {
    value = dateValue(value);
    return this.optional(element) || !/Invalid|NaN/.test(new Date(value).toString());;
}

function dateValue(value) {
    var date = value.split("/");
    return date[2] + "/" + date[1] + "/" + date[0]
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接