Lutte avec validation de formulaire jQuery

Question

Je crée un formulaire de registre très simple avec seulement deux entrées et un bouton de soumission.
Le problème que je rencontre est qu'il ne complétera qu'une instruction if.

Voici le jQuery j'ai fait:

$("#usernameError").hide(); 
$("#passwordError").hide(); 

$("#registrationSubmit").click(function(){ 

    if($("#username").val() == ""){ 

    $("#usernameError").show(); 
    return false; 
    } 

    if($("#passwordReg").val() == ""){ 

    $("#passwordError").show(); 
    return false; 
    } 
}); 

Et voici le code HTML en utilisant bootstrap:

<div class="modal fade" id="add-admin-modal"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header admin"> 
     Please Enter Details 
     </div> 
     <div class="modal-body admin"> 
     <form id="registrationForm" action="registerAction.php" method="post"> 
      <div class="form-group"> 
      <label for="">Username</label> 
      <input name="username" type="username" class="form-control" id="username" aria-describedby="emailHelp" placeholder="Enter Username"> 
      <div id="usernameError" class="alert alert-danger pad" role="alert">A Username is required!</div> 
      </div> 
      <div class="form-group"> 
      <label for="password">Password</label> 
      <input name="password" type="password" class="form-control" id="passwordReg" placeholder="Password"> 
      <div id="passwordError" class="alert alert-danger pad" role="alert">A Password is required!</div> 
      </div> 

      <div class="form-group"> 
      <button type="submit" id="registrationSubmit" name="registrationSubmit" class="btn btn-success">Ok</button> 
      <button class="btn btn-default" data-dismiss="modal">Cancel</button> 
      </div> 
     </form> 
     </div> 
    </div> 
    </div> 
</div> 
<script src="validations.js"></script> 

Le script validera le nom d'utilisateur et montrer l'erreur, mais ne fait rien avec le mot de passe.

Est-ce parce que j'utilise return false pour empêcher le formulaire de soumission?
Que puis-je utiliser à la place?

Answer 1

Oui, c'est la raison, supprimez l'instruction return. Vous pouvez utiliser une variable booléenne errorOccurred et la définir sur true s'il y a eu une erreur. Quelque part vous avez une fonction de publication qui ne publiera pas de données si une erreur s'est produite.

Answer 2

Vous revenez de votre code. Ne faites pas cela si vous voulez exécuter du code après

var ValidationFailed = false; 

if($("#username").val() == ""){ 

    $("#usernameError").show(); 
    ValidationFailed = true; 
} 

if($("#passwordReg").val() == ""){ 

    $("#passwordError").show(); 
    ValidationFailed = true; 

} 
//..... 

return ValidationFailed;