2016-07-09 10 views
0

jQueryバリデータライブラリを使用しようとしていますが、DOMにメッセージを表示することができません。私は同様の質問を読むが、私の間違いは見つけられなかった。jQueryバリデータのメッセージが表示されない

CSSには.errorクラスも追加されています。

<html> 
<style> 
    .error{ 
     color: red; 
    } 
</style> 
<main> 
    <div class="registration-mask"> 
     <form name="signup-advertiser" id="signup-form"> 
      <div class="row"><div class="col-sm-4 left"><label for="lastname">Last Name:</label></div> <div class="col-sm-10"><input type="text" name="lastname"></div></div> 
      <div class="row"><div class="col-sm-4 left"><label for="password1">Password:</label></div> <div class="col-sm-10"><input type="password" name="password1"></div></div> 
      <div class="row"><div class="col-sm-4 left"><label for="password">Repeat Password:</label></div> <div class="col-sm-10"><input type="password" name="password"></div></div> 

      <button id="signup-btn">Sign Up!</button> 
     </form> 
    </div> 


</main> 

<!-- jQuery first, then Bootstrap JS. --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/js/bootstrap.min.js" integrity="sha384-vZ2WRJMwsjRMW/8U7i6PWi6AlO1L79snBrmgiDpgIWJ82z8eA5lenwvxbMV1PAh7" crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script> 
<script> 
    $(document).ready(function() { 

     $('#signup-form').validate({ 
      rules: { 
       lastname: { 
        required: true 
       }, 
       passwrod: { 
        equalTo: password1 
       } 
      }, 
      messages: { 
       lastname: "Please enter your last name", 
       password: "The passwords you entered don't match" 
      } 
     }); 

    }); 
</script> 

</body> 
</html> 

答えて

0

パスワードのスペルは、それが

<input type="text" id="lastname" name="lastname"> 
<input type="password" id="password1" name="password1"> 
<input type="password" id="password" name="password"> 
+0

おかげで動作します従うようにすべてのinput要素のidを与える

passwrod: { equalTo: password1 } 

スクリプト内に間違っています。どのようにエラーメッセージを別の場所に置くことができますか?入力の下にない? – ocram

+0

jQuery Validateは 'name'のみを使用し、** id'は使用しません。 – Sparky

関連する問題