Validation

フォームの入力チェックに便利なjQueryvalidationプラグインの紹介
自分が使っているvalidationがマイナーなせいかネットで探してもなかなか出てこないので自分的メモ。
サンプル
http://moeten.info/maidcafe/?&m=otoiawase
空白のままフォームを送信してみてください。
使い方

head 部分
<script language="javascript" type="text/javascript" src="jQuery.js"></script>
<script language="javascript" type="text/javascript" src="validation.js"></script>
<script type="text/javascript">
$(function() {
    $("#form").validate();
});
</script>
body 部分
<form action="hogehoge.php" method="post" id="form">
名前(必須):
<input type="text" name="myname" class="required">
<input type="submit" value="送信">
</form>

class="required"と指定するだけでチェックしてくれるので便利。

classに指定できる項目。よく使うもの。

ちなみにclass="required url"等どして複数指定可能です。

required 必須項目。ないとエラー
number 数値の入力可能
alphabet アルファベットのみ入力可能
email メールアドレスの適合性チェック
url http://のみ受け付ける。ドメインまで指定しないとエラー

細かいルールを追加する方法

同一かチェック(email_checkとemalのフォーム内容をチェック)

{
  rules: {
    "email_check" : { equalTo : ".email" }
  }
}

数値の制限

{
  rules: {
    "num_people"  : { range   : [4, 100] }
  }
}

上記をまとめて指定

{
  rules: {
    "num_people"  : { range   : [4, 100] },
    "email_check" : { equalTo : ".email" }
  }
}

ルールを使用したときの使い方

    $(function() {
        $("#form").validate(
          {
            rules: {
              "num_people"  : { range   : [4, 100] },
              "email_check" : { equalTo : ".email" }
            }
          }
        );
    });