21

我正在使用 Asp.Net Mvc3 和不显眼的 jquery 验证。我想让我的日期验证本地化,我的意思是,jquery 正在验证我的日期为 MM/dd/yyyy,但我希望它是 dd/MM/yyyy。

我正在尝试使用 jQuery Globalize 插件(http://github.com/jquery/globalize)。我添加了对脚本 globalize.js 和 globalize.culture.pt-BR.js 的引用,当我的页面加载时,我正在运行以下脚本:

(function() {
  $(function() {
    $.datepicker.setDefaults($.datepicker.regional['pt-BR']);
    Globalize.culture("pt-BR");
  });
}).call(this);

jQuery UI 插件就像魅力一样,但验证却没有。我还缺少什么?

编辑:

使用下面答案中的链接,我使用Globalize 插件解决了问题:

当然,我必须在页面中添加对 Globalize 插件的引用以及对我想要使用的文化的引用(所有这些都可以在插件的网站上找到)。之后只是一小段 JavaScript 代码。

Globalize.culture("pt-BR");
$.validator.methods.date = function(value, element) {
    return this.optional(element) || Globalize.parseDate(value);
};
4

3 回答 3

17

我自己最近也在做类似的事情。我首先遵循 Scott Hanselman 的博客中关于这个主题的建议 - 你可以在这里阅读:

http://www.hanselman.com/blog/GlobalizationInternationalizationAndLocalizationInASPNETMVC3JavaScriptAndJQueryPart1.aspx

我不得不做一些改变来使用 Globalize 而不是 jQuery Global(现在 jQuery Global 已经死了)。我在下面的博客文章中写了这个,以防有帮助:

http://icanmakethiswork.blogspot.co.uk/2012/09/globalize-and-jquery-validate.html

我的博客文章提供了指向此脚本 jquery.validate.globalize.js 的链接,该脚本强制 jQuery Validate 使用 Globalize 进行数字/日期/范围解析。其中的日期部分可能应该可以解决您的问题:

https://raw.github.com/gist/3651751/68cbccd0fdd4725a8d6fd1b5568bb33d27fb1eff/jquery.validate.globalize.js

/// <reference path="jquery-1.7.2.js" />
/// <reference path="jquery.validate.js" />
/// <reference path="globalize.js" />

/*!
* Monkey patch for jquery.validate.js to make use of Globalize.js number and date parsing
*/

$(document).ready(function () {

    var currentCulture = $("meta[name='accept-language']").prop("content");

    // Set Globalize to the current culture driven by the meta tag (if any)
    if (currentCulture) {
        Globalize.culture(currentCulture);
    }

    //Tell the validator that we want numbers parsed using Globalize.js
    $.validator.methods.number = function (value, element) {    
        if (Globalize.parseFloat(value)) {
            return true;
        }
        return false;
    }

    //Tell the validator that we want dates parsed using Globalize.js
    $.validator.methods.date = function (value, element) {
        if (Globalize.parseDate(value)) {
            return true;
        }
        return false;
    }

    //Fix the range to use globalized methods
    jQuery.extend(jQuery.validator.methods, {
        range: function (value, element, param) {
            //Use the Globalization plugin to parse the value
            var val = Globalize.parseFloat(value);
            return this.optional(element) || (val >= param[0] && val <= param[1]);
        }
    });

});
于 2012-09-08T07:02:30.063 回答
10

如果您正在从事国际化和 ASP.NET MVC 方面的工作,我强烈建议您阅读 Nadeem Afana 的这两篇优秀文章

在他的第二篇文章中,他有一个使用 jQuery UI 日期选择器的详细示例,并讨论了本地化问题。

在他的例子中,他提到了以下内容

@* Unfortunately, the datepicker only supports Neutral cultures, so we need to adjust date and time format to the specific culture *@
    $("#EventDate").change(function(){
      $(this).val(Globalize.format($(this).datetimepicker('getDate'), Globalize.culture().calendar.patterns.d + " " + Globalize.culture().calendar.patterns.t)); /*d t*/
    });

我还建议下载他网站上链接的 Nerd Dinner 国际化演示。

于 2011-09-16T00:10:32.460 回答
5

约翰尼赖利回答的一点修正:

 $.validator.methods.number = function (value, element) {    
    if (Globalize.parseFloat(value)) {
        return true;
    }
    return false;
}

必须替换为

$.validator.methods.number = function (value, element) {
    return !isNaN(Globalize.parseFloat(value));
}

用于正确解析零字符串(“0”)。

所以整个代码是:

/// <reference path="jquery-1.7.2.js" />
/// <reference path="jquery.validate.js" />
/// <reference path="globalize.js" />

/*!
* Monkey patch for jquery.validate.js to make use of Globalize.js number and date parsing
*/

$(document).ready(function () {

    var currentCulture = $("meta[name='accept-language']").prop("content");

    // Set Globalize to the current culture driven by the meta tag (if any)
    if (currentCulture) {
        Globalize.culture(currentCulture);
    }

    //Tell the validator that we want numbers parsed using Globalize.js
    $.validator.methods.number = function (value, element) {    
       return !isNaN(Globalize.parseFloat(value));
    }

    //Tell the validator that we want dates parsed using Globalize.js
    $.validator.methods.date = function (value, element) {
        if (Globalize.parseDate(value)) {
            return true;
        }
        return false;
    }

    //Fix the range to use globalized methods
    jQuery.extend(jQuery.validator.methods, {
        range: function (value, element, param) {
            //Use the Globalization plugin to parse the value
            var val = Globalize.parseFloat(value);
            return this.optional(element) || (val >= param[0] && val <= param[1]);
        }
    });

});
于 2012-10-24T08:45:25.317 回答