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



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

我试图使用jQuery Globalize插件(http://github.com/jquery/globalize)。我添加了对脚本global .js和global .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);
};

我最近也在做类似的事情。我从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]);
        }
    });
});

如果您正在做任何与国际化和ASP有关的工作。我强烈推荐阅读Nadeem Afana的这两篇优秀的文章

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

在他的第二篇文章中,他有一个使用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国际化演示链接在他的网站上。

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

最新更新