使用asp.net mvc 3本地化jquery验证

Question

我正在使用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);
};

Answer 1

我最近自己做的很相似.我开始遵循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]);
        }
    });

});

Answer 2

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

• ASP.NET MVC 3国际化
• ASP.NET MVC 3国际化 - 第2部分(NerdDinner演示)

在他的第二篇文章中,他有一个使用jQuery UI datepicker的详细示例,并讨论了本地化的问题.

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

@* 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国际化演示.

Answer 3

约翰尼·赖利（Johnny Reilly）的答案稍作修正：

 $.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]);
        }
    });

});