Asp.NetMvc3と目立たない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);
};
国際化とASP.NETMVCで作業をしている場合は、NadeemAfanaによるこれら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*/
});
また、彼のサイトにリンクされているNerdDinnerの国際化デモをダウンロードすることをお勧めします。
私は最近、同じようなことをしています。私はこのトピックに関するScottHanselmanのブログのアドバイスに従うことから始めました-これについてはここで読むことができます:
JQuery Globalの代わりにGlobalizeを使用するには、いくつかの変更を加える必要がありました(jQuery Globalは廃止されました)。役立つ場合に備えて、次のブログ投稿にこれを書きました。
http://icanmakethiswork.blogspot.co.uk/2012/09/globalize-and-jquery-validate.html
私のブログ投稿には、このスクリプトjquery.validate.globalize.jsへのリンクがあり、jQueryValidateが数値/日付/範囲の解析にGlobalizeを使用するように強制しています。これの日付部分は、おそらく問題を解決するはずの部分です。
/// <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]);
}
});
});
ジョニー・レイリーの答えの少しの修正:
$.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]);
}
});
});