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

jQuery Global の代わりに Globalize を使用するには、いくつかの変更を加える必要がありました (現在、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 による次の 2 つの優れた投稿を読むことを強くお勧めします。

2 回目の投稿では、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 国際化デモをダウンロードすることをお勧めします。

于 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 に答える