jQuery-Validation-Engine をダウンロード
公開サイトの DownloadZip からZIPファイルをダウンロード
GitHub - posabsolute/jQuery-Validation-Engine: jQuery form validation plugin
jQuery form validation plugin. Contribute to posabsolute/jQuery-Validation-Engine development by creating an account on GitHub.
必要なファイル
CSSファイル /css/validationEngine.jquery.css jQuery本体 /js/jquery-1.8.2.min.js 「jQuery-Validation-Engine」日本語化スクリプト /js/languages/jquery.validationEngine-ja.js 「jQuery-Validation-Engine」本体 /js/jquery.validationEngine.js
設置方法
1.jsとcssを読み込む
PHP
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>
<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="js/languages/jquery.validationEngine-ja.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
2.フォームのidを指定する
[javascript] /* (例:if=”form_id”)の場合 */ [/javascript]3.設定はクラスに記載する
入力必須チェック:
PHP
<input type="text" class="validate[required]">
PHP
必須メールチェック validate[required,custom[email]]
必須じゃないメールチェック validate[optional,custom[email]]
最小6文字入力チェック validate[required,minSize[6]]
最大12文字入力ちぇく validate[required,maxSize[12]]
最大と最小入力チェック validate[required,minSize[6],maxSize[12]]
(※ここでの文字数の指定は、バイト数ではなく文字数なので、
半角英字でも全角日本語でも、どちらでも1文字は1文字とカウントされます。)
英字と空白のみの入力をチェック validate[required,custom[onlyLetterSp]]
数字のみのチェック validate[required,custom[number]]
数字と空白のみの入力をチェック validate[required,custom[onlyNumberSp]]
数字チェック(小数点はエラー,マイナス符号はOK) validate[required,custom[integer]]
数字チェック、小数点と31以上はエラー validate[required,custom[integer],max[30]]
URLチェック(HTTP、HTTPS、FTPの3種類はOK) validate[required,custom[url]]
電話番号チェック validate[required,custom[phone]]
パスワードチェック
1つめに validate[required]
2つめに validate[required,equals[1つめのname]]
PHP
1つめ入力:
<input type="password" name="password1" id="password1"
value="" class="validate[required]">
2つめ確認:
<input type="password" name="password2" id="password2"
value="" class="validate[required,equals[password1]]">
バルーン内に表示されるエラーメッセージを修正する方法
jquery.validationEngine-ja.jsファイル内のソースを修正します。文字コードはUTF-8(BOMなし)