jquery-validation-1.9.0
6269 ワード
jQuery検証プラグイン:
シンプルで効率的なクライアント検証フレームワークで、パーソナライズされた効果を実現するために多くの属性を提供します.できるだけ少ないエラーメッセージを表示して、画面がユーザーに友好的な効果をもたらすようにユーザーに提示します.
Email、Urlなど、多くの一般的な検証方法を内蔵し、インタフェースも提供しています.
独自の検証メソッドを実装したり、サーバ側メソッドを呼び出して検証したりすることができます.
国際化をサポートし、36言語のエラーメッセージをサポートし、デフォルトでは英語版のエラーメッセージを使用します.
form提出時
デフォルトのフォーカスは、最初の検証が通過しないコントロールに設定されています(逆にすることもできます).2つのコントロールの検証が通じず、前のフォーカスが後のコントロールにコミットされると、自動的に後のコントロールにフォーカスが設定され、ユーザーが変更しやすいようになります.
値が変更されると自動的に検証され、複数のエラーが同時に表示されます.コミットされると、デフォルトではすべての検証に通じないコントロールがマークされます.また、修正されると、修正された値が検証に合格すると、エラーマークは自動的に消えます.
怠惰検証:Formが最初にコミットされる前にtabキーを使用してコントロールを切り替えると、検証操作はトリガーされません.
ただし、値を変更すると、検証メソッドが自動的に呼び出されて検証されます.検証に合格すると、対応するエラーメッセージが自動的に消えます.
$.validator.addMethod(name,method,[message])が実現可能
条件検証の効果、すなわち、条件に基づいて動的に検証ルールを追加、削除する使用例を以下に示す.
プラグインで重要な2つの概念:
method:検証方法、真の検証ロジックを実現
rule:検証ルール、コントロールに関連付けられた検証メソッド名、コントロールが行う検証操作を示す
デフォルトの使用
class=「required email」でコントロールに対応する検証ルールを設定
デフォルトの組み込み方法:
グループ化検証、複数のコントロールを一緒に検証(検証メソッド、プロンプトメッセージに対応):
Plugins/Validation/multiplefields
再構築検証(複数のコントロールは同じ検証ルールとプロンプトメッセージを使用します):
エラーメッセージの優先順位:A custom message(passed by plugin options)、the element's title、the default message.
プラグインデバッグ:debugオプションの値をtrueに設定すると、検証が通過するかどうかにかかわらず、formのコミットが阻止され、windowに役立つ情報が出力されます.コンソール(firebugまたはfirebug liteで見ることができます)
複数のformが画面にある場合、プラグインはデフォルトで毎回1つのformのみを検証し、$を通過することができる.validator.setDefaults({...}) を使用して、複数のformを一度に検証できるようにデフォルトの動作を変更します.
Ajax検証:
デフォルトのヒントを変更するには、次の手順に従います.
プロトコル:MIT/GPL
公式サイト:
jQuery plugin: Validation
参照ドキュメント:
Plugins/Validation
デモデモデモ:
jQuery Validation Plugin Demo
FAQ:
Plugins/Validation/Reference
シンプルで効率的なクライアント検証フレームワークで、パーソナライズされた効果を実現するために多くの属性を提供します.できるだけ少ないエラーメッセージを表示して、画面がユーザーに友好的な効果をもたらすようにユーザーに提示します.
Email、Urlなど、多くの一般的な検証方法を内蔵し、インタフェースも提供しています.
独自の検証メソッドを実装したり、サーバ側メソッドを呼び出して検証したりすることができます.
国際化をサポートし、36言語のエラーメッセージをサポートし、デフォルトでは英語版のエラーメッセージを使用します.
form提出時
デフォルトのフォーカスは、最初の検証が通過しないコントロールに設定されています(逆にすることもできます).2つのコントロールの検証が通じず、前のフォーカスが後のコントロールにコミットされると、自動的に後のコントロールにフォーカスが設定され、ユーザーが変更しやすいようになります.
値が変更されると自動的に検証され、複数のエラーが同時に表示されます.コミットされると、デフォルトではすべての検証に通じないコントロールがマークされます.また、修正されると、修正された値が検証に合格すると、エラーマークは自動的に消えます.
怠惰検証:Formが最初にコミットされる前にtabキーを使用してコントロールを切り替えると、検証操作はトリガーされません.
ただし、値を変更すると、検証メソッドが自動的に呼び出されて検証されます.検証に合格すると、対応するエラーメッセージが自動的に消えます.
$.validator.addMethod(name,method,[message])が実現可能
条件検証の効果、すなわち、条件に基づいて動的に検証ルールを追加、削除する使用例を以下に示す.
プラグインで重要な2つの概念:
method:検証方法、真の検証ロジックを実現
rule:検証ルール、コントロールに関連付けられた検証メソッド名、コントロールが行う検証操作を示す
デフォルトの使用
class=「required email」でコントロールに対応する検証ルールを設定
// , , , name !!! jquery ?
$("#myform").validate({
rules: {
txtUrl: {url: true},
txtEmail: {email : true},
// no quoting necessary
name: "required",
// quoting necessary! ,
"user[email]": "email",
// dots need quoting, too!
"user.address.street": "required"
}
});
デフォルトの組み込み方法:
required( ) Returns: Boolean
Makes the element always required.
required( dependency-expression ) Returns: Boolean
Makes the element required, depending on the result of the given expression.
required( dependency-callback ) Returns: Boolean
Makes the element required, depending on the result of the given callback.
remote( options ) Returns: Boolean
Requests a resource to check the element for validity.
minlength( length ) Returns: Boolean
Makes the element require a given minimum length.
maxlength( length ) Returns: Boolean
Makes the element require a given maxmimum length.
rangelength( range ) Returns: Boolean
Makes the element require a given value range.
min( value ) Returns: Boolean
Makes the element require a given minimum.
max( value ) Returns: Boolean
Makes the element require a given maximum.
range( range ) Returns: Boolean
Makes the element require a given value range.
email( ) Returns: Boolean
Makes the element require a valid email
url( ) Returns: Boolean
Makes the element require a valid url
date( ) Returns: Boolean
Makes the element require a date.
dateISO( ) Returns: Boolean
Makes the element require a ISO date.
number( ) Returns: Boolean
Makes the element require a decimal number.
digits( ) Returns: Boolean
Makes the element require digits only.
creditcard( ) Returns: Boolean
Makes the element require a creditcard number.
accept( extension ) Returns: Boolean
Makes the element require a certain file extension.
equalTo( other ) Returns: Boolean
Requires the element to be the same as another one
additional-methods.js
グループ化検証、複数のコントロールを一緒に検証(検証メソッド、プロンプトメッセージに対応):
Plugins/Validation/multiplefields
再構築検証(複数のコントロールは同じ検証ルールとプロンプトメッセージを使用します):
// alias required to cRequired with new message
$.validator.addMethod("cRequired", $.validator.methods.required,
"Customer name required");
// alias minlength, too
$.validator.addMethod("cMinlength", $.validator.methods.minlength,
// leverage parameter replacement for minlength, {0} gets replaced with 2
$.format("Customer name must have at least {0} characters"));
// combine them both, including the parameter for minlength
$.validator.addClassRules("customer", { cRequired: true, cMinlength: 2 });
// , class:customer
<input name="customer1" class="customer" />
<input name="customer2" class="customer" />
<input name="customer3" class="customer" />
エラーメッセージの優先順位:A custom message(passed by plugin options)、the element's title、the default message.
プラグインデバッグ:debugオプションの値をtrueに設定すると、検証が通過するかどうかにかかわらず、formのコミットが阻止され、windowに役立つ情報が出力されます.コンソール(firebugまたはfirebug liteで見ることができます)
複数のformが画面にある場合、プラグインはデフォルトで毎回1つのformのみを検証し、$を通過することができる.validator.setDefaults({...}) を使用して、複数のformを一度に検証できるようにデフォルトの動作を変更します.
Ajax検証:
$("#myform").validate({
rules: {
username: {
required: true,
minLength: 2,
remote: "users.php"
}
},
messages: {
username: {
required: "Enter your username",
minLength: "At least 2 characters are necessary",
remote: String.format("The name {0} is already in use")
}
}
});
デフォルトのヒントを変更するには、次の手順に従います.
$.extend($.validator.messages, {
required: "Eingabe nötig",
email: "Bitte eine gültige E-Mail-Adresse eingeben",
...
});
プロトコル:MIT/GPL
公式サイト:
jQuery plugin: Validation
参照ドキュメント:
Plugins/Validation
デモデモデモ:
jQuery Validation Plugin Demo
FAQ:
Plugins/Validation/Reference