2011-11-12 3 views
1

このコードはうまく見えますが、エラーの原因がわかりません。これは、$(ドキュメント).ready(関数(){で正しくラップされています。Jquery.validateが見つかりません:プロパティIDの後

$("#signup-form").validate({ 
    rules: { 
     firstname: 'required', 
     signup-email: 'required', 
     signup-password: 'required', 
     signup-password-v: 'required' 
    }, 
    messages: { 
     firstname: 'Your firstname is required!', 
     signup-email: 'Your email is required!', 
     signup-password: 'A password is required!', 
     signup-password-v: 'Please verify your password!' 
    } 
}); 

私は任意のアイデアので、HTMLのheadタグでjQueryライブラリの後jquery.validateを呼ぶ?

HTML

signup-email: 'Your email is required!', 

私はあなたがこれらのプロパティをラップすることができると思う:あなたはプロパティ名にダッシュを持つことはできません

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title></title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <link rel='stylesheet' type='text/css' href='./css/index.css' /> 
     <script type="text/javascript" src="./js/jquery-1.6.2.min.js"></script> 
     <script type="text/javascript" src="./js/jquery.validate.js"></script> 
     <script type="text/javascript" src="./js/index.js"></script> 
    </head> 
    <body> 
     <div id="navbar"> 
      <div id="title">CrockShark.com</div> 
     </div> 
     <div id="container"> 
      <div id="navcontainer"> 
       <ul id="navlist"> 
        <li>Find great Crockpot recipes</li> 
        <li>Save 'em</li> 
        <li>Post your own</li> 
        <li>See how many people like yours</li> 
       </ul> 
      </div> 
      <div id="signup"> 
       <form id="signup-form"> 
       <label>First Name:</label> 
        <input type="text" class="signup-input" id ="firstname" name="firstname" /><br /> 
       <label>Last Name:</label> 
        <input type="text" class="signup-input" id="lastname" name="lastname" /><br /> 
       <label>Birthday:</label> 
        <select id="month" name="month"> 
         <option value="1">January</option> 
         <option value="2">February</option> 
         <option value="3">March</option> 
         <option value="4">April</option> 
         <option value="5">May</option> 
         <option value="6">June</option> 
         <option value="7">July</option> 
         <option value="8">August</option> 
         <option value="9">September</option> 
         <option value="10">October</option> 
         <option value="11">November</option> 
         <option value="12">December</option> 
        </select> 
        <select id="day" name="day"> 
         <?php for ($i=1; $i<=31; $i++) { echo "<option value='$i'>$i</option>"; } ?> 
        </select> 
        <select id="year" name="year"> 
         <?php for ($i=2012; $i>=1900; $i=$i-1) { echo "<option value='$i'>$i</option>"; } ?> 
        </select><br /> 
       <label>Email:</label> 
        <input type="text" class="signup-input" id="signup-email" name="signup-email" /><br /> 
       <label>Password:</label> 
        <input type="password" class="signup-input" id="signup-password" name="signup-password" /><br /> 
       <label>Verify Password:</label> 
        <input type="password" class="signup-input" id="signup-password-v" name="signup-password-v" /><br /> 
        <input type="button" id="signup-button" name="signup-button" value="Join!" /> 
      </form> 
      </div> 
      <div id="login"> 
       <div id="login-wrapper"> 
        <label>Email:</label><input type="text" class="login" id="login-email" /><br /> 
        <label>Password:</label><input type="password" class="login" id="login-password" /> 
        <input type="button" id="login-button" value="Login" /> 
       </div> 
      </div> 
     </div> 
    </body> 
</html> 

答えて

8

それは簡単な言及するスクリプト

$(document).ready(function(){ 
$("#signup-form").validate(); 
}); 

いくつかのポイントをチェックできるようにすること

'signup-email': 'Your email is required!', 
+0

素晴らしい、あなたは正しかったです、 どうもありがとうございました! – Nathan

+0

問題ありません[スペースを埋める]。 – Blender

0

試し:引用符は、しかし、そしてあなたの所望の効果を得る -

  1. をそして、あなたがする必要がありフォームが提出されていることを確認してください。

  2. あなたはタイプを提出

  3. のHTML入力を持っていることを確認し、入力に必要なフィールドを追加し

+0

入力をsubmit typeに変更しましたが、何も検証されていないため、理由を特定できません。 Firebugによれば、すべての図書館は完璧に読み込まれていますが、私が書式を提出すると私のメッセージは表示されません。 – Nathan

+0

index.jsが外部ファイルである必要があるのだろうか? – Nathan

+0

これは機能しています! – Nathan

1

これはjqueryの検証プラグインのドキュメントです。フォームは法的JavaScriptの識別子ではない名前を使用してフィールドで構成されている場合、あなたはルールのオプションを使用する場合、これらの名前を引用する必要があり、それを

http://docs.jquery.com/Plugins/Validation/Reference#Fields_with_complex_names_.28brackets.2C_dots.29

を参照してください。

$("#myform").validate({ 
    rules: { 
    // no quoting necessary 
    name: "required", 
    // quoting necessary! 
    "user[email]": "email", 
    // dots need quoting, too! 
    "user.address.street": "required" 
    } 
}); 
関連する問題