jQueryValidationのチェックルールその2
script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">文字列長のチェック
minlength=””
で最小文字列
maxlength=””
で最大文字数を指定することが可能
例えば、Twitterみたいに140文字までにするなら
<input type="text" minlength="1" maxlength="140"/>
入力値が一致しているかチェック
これは、ログインのパスワードとか
確認のため、もう一回入力という、あらかじめ値があるものときに使う
これには、
equalTo=””
を使う
パスワード: <input type="password" value="" id="password"/> パスワード(確認): <input type="password" value="" id="confirmpasswd" equalTo="#password"/>
というように使う
#password
は、id=”password” なので、これと比較している
会員登録でよくある
メールアドレス
パスワード
など、間違えると後々すごく困るものに使う
エラーメッセージの内容と、表示場所の変更
エラーメッセージの変更関連は
label要素を使う
<input type="email" id="userid" name="userid" class="required"/> <label for="userid" class="error" style="display:none;"> メールアドレスを入力してください </label>
label要素の
for=”” には、検証したいフィールド
今回なら input要素
の
id=””
もしくは
name=””
の中身を指定する
そして、class=”error”を指定しておく
最初に画面を開いたときには
このエラーメッセージは出したくないので
style=”display:none;”
としておくことで非表示になる
あと、今回は
input の下へ label を書いたから下にエラーメッセージがでるけど
入力欄の上にエラーメッセージを出したいのなら
<label for="userid" class="error" style="display:none;"> メールアドレスを入力してください </label> <input type="email" id="userid" name="userid" class="required"/>
とすれば
上にエラーメッセージが表示される