web-dev-qa-db-ja.com

jquery検証ローカリゼーションを有効にする方法は？

Jquery mobileを使用して登録フォームを実装しています。ユーザーは、ドイツ語、英語、フランス語のいずれかでこのフォームに入力することを選択できます。フォームを各言語で表示するために使用される複数の内部ページがあります。ユーザーは、メニューボタンを使用して希望の言語を選択します。

クライアント側のフォーム検証を処理するためにjquery検証プラグインを使用しています。これは正常に動作します..各言語ページのフォームに適切なエラーメッセージを有効にする方法を知りたいですか？ githubからプラグインをダウンロードすると、すべてのローカリゼーションエラーコードが含まれていますが、有効にする方法がわかりません。

これは、各言語ページのフォーム検証の実装を処理するために使用しているJavaScriptコードです。

ドイツ語とフランス語のページに適切なエラーメッセージを表示できるようにご協力いただきありがとうございます。

$(document).on("pageshow", "#page_deutsch", function() {

$("#register_deutsch").validate();

});

$(document).on("pageshow", "#page_english", function() {

$("#register_english").validate();

});

$(document).on("pageshow", "#page_francais", function() {

$("#register_francais").validate();

});
javascriptjqueryformsvalidationjquery-mobile
15
Andrew Phillips

jQuery検証プラグインのローカリゼーションjQuery検証プラグインのデフォルト言語は英語です。ローカリゼーションjsファイルなどでオーバーライドできます。 es、zh、frなど。サポートされている言語のリストについては こちら を参照してください。

言語サポートを有効にするには、他の言語メッセージjsをウェブページ（html/jsp/xhtml）に追加するだけです。フランス語用

<script type="text/javascript" src="http://jzaefferer.github.io/jquery-validation/localization/messages_fr.js" />

中国語用

<script type="text/javascript" src="http://jzaefferer.github.io/jquery-validation/localization/messages_zh.js" />

他の言語についても同様ですが、適切な言語のjsを見つけて、そのjsをWebページに追加します。

必要な言語がリストにない場合、実行可能な代替策は、messages_xx.jsのコピーをプロジェクトのワークスペースにダウンロードし、それを必要な言語に変更することです。

言語jsが提供されていますが、問題は1つのWebページにありますが、使用できる言語メッセージのタイプは1つだけです。 Webページに複数の言語のメッセージjsがある場合、最後のメッセージが使用されます。

この問題を解決するには、システムロケールごとにメッセージjsを動的にロードします。

<script type="text/javascript" src="http://jzaefferer.github.io/jquery-validation/localization/messages_<%= Locale.getDefault().getLanguage() %>.js" />

上記のソリューションでは、最終的に、さまざまなシステムロケールによってさまざまな言語のメッセージを動的に処理できます。

ここにリソースバンドルで複数の言語を処理する別の方法があります。

関連するjQuery検証記事：

  • Eメール
  • クレジットカード
  • 複数のフォームフィールド
  • エラーメッセージのカスタマイズ
  • JSFでのjQuery検証プラグインの使用
  • 多言語エラーメッセージ
  • JQuery Validation Pluginでのエラー処理

できた!!

24
Егор Синицин

ローカリゼーションファイルは jsdelivr および cloudflare CDNでも利用できます。

例えば

https://cdn.jsdelivr.net/npm/[email protected]/dist/localization/messages_de.jshttps://cdn.jsdelivr.net/npm/ [email protected]/dist/localization/messages_fr.jshttps://cdn.jsdelivr.net/npm/[email protected]/dist/localization/messages_es.js

または

https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/localization/messages_de.jshttps://cdnjs.cloudflare.com/ajax/ libs/jquery-validate/1.17.0/localization/messages_fr.jshttps://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/localization/messages_es.js

0
Rinda