Локализация проверки JQuery с Asp.net MVC 3 - PullRequest
Новая
       36

Локализация проверки JQuery с Asp.net MVC 3

21 голосов
/ 16 сентября 2011

Я использую 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);
};

Ответы [ 3 ]

17 голосов
/ 08 сентября 2012

Я недавно делал подобное сам. Я начал с того, что следовал совету в блоге Скотта Хансельмана на эту тему - вы можете прочитать об этом здесь:

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

});
10 голосов
/ 16 сентября 2011

Если вы занимаетесь какой-либо работой с интернационализацией и ASP.NET MVC, я настоятельно рекомендую прочитать эти два превосходных поста Надима Афаны

Во втором посте он подробно описывает использование средства выбора даты 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, размещенную на его сайте.

4 голосов
/ 24 октября 2012

Небольшое исправление ответа Джонни Рейли: 

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

});
...