2016-07-09 20 views
0

Ich versuche, die jQuery-Validierungsbibliothek zu verwenden, aber ich kann die Nachricht nicht im DOM anzeigen. Ich habe ähnliche Fragen gelesen, konnte aber meinen Fehler nicht finden.Die jQuery-Validator-Nachricht wird nicht angezeigt

Beachten Sie, dass ich auch die .error Klasse in CSS hinzugefügt.

<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> 

Antwort

0

Passwort Rechtschreibung ist falsch in Skript

passwrod: { 
    equalTo: password1 
} 

die ID für alle Eingabeelement Geben Sie wie folgt dann wird es

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

dank arbeiten. Wie kann ich die Fehlermeldungen woanders platzieren? Nicht unter dem Eingang? – ocram

+0

jQuery Validate verwendet nur den 'name', ** NOT ** die' id'. – Sparky