validation de formulaire html ne fonctionne pas

Je travaillais sur un formulaire html où je dois entrer les informations de l'utilisateur et sur soumettre. Il va naviguer vers la page de connexion php. Le problème est que j'ai essayé de valider les données avant de soumettre via JavaScript et ce n'est pas le cas.validation de formulaire html ne fonctionne pas

Ci-dessous je poste le code de formulaire HTML.

<!DOCTYPE html> 
<html> 
<head> 
<script language = "JavaScript"> 
     function validate() 
     { 
      var username = document.getElementById("userName").value; 
      var password = document.getElementById("Password").value; 
      var repassword = document.getElementById("RePassword").value; 

      if (username.length < 0) { 
       alert("Please enter the username."); 
       return false; 
      } 
      if (password == null || password == "") { 
       alert("Please enter the password."); 
       return false; 
      } 
      if (repassword == null || repassword == "" || repassword != password) { 
       alert("Please enter the password."); 
       return false; 
      } 


     } 
</script> 

</head> 
<body> 
<form name="frmMr" action="send_post.php" method="post" onsubmit="return(validate());"> 
    User Name:<br> <input type="text" name="userName"><br> 
    Enter Password:<br> <input type="text" name="Password"><br> 
    Reenter Password:<br> <input type="text" name="RePassword"><br> 
    <input type="submit" > 
</form> 
<p id="error_para" ></p> 
</body> 
</html>

Source

2016-10-03 Animesh Jena

Vos champs de saisie n'ont pas d'ID, donc getElementById renvoie null. – niandrei

Votre HTML n'a pas étiquette id, alors qu'en Javascript que vous utilisez getElementById('')

<!DOCTYPE html> 
<html> 
<head> 
// Changed the script syntax 
<script type="text/javascript"> 
    function validate() { 
     var username = document.getElementById("userName").value; 
     var password = document.getElementById("Password").value; 
     var repassword = document.getElementById("RePassword").value; 

     if (username.length <= 0) { 
      alert("Please enter the username."); 
      return false; 
     } 
     if (password == null || password == "") { 
      alert("Please enter the password."); 
      return false; 
     } 
     if (repassword == null || repassword == "" || repassword != password) { 
      // Changed Password message for testing 
      alert("Confirm Password empty or do not match."); 
      return false; 
     } 
    } 
</script> 
</head> 
<body> 
    <form name="frmMr" action="send_post.php" method="post" onsubmit="return(validate());"> 
     User Name:<br> <input type="text" id="userName" name="userName"><br> 
     Enter Password:<br> <input type="text" id="Password" name="Password"><br> 
     Reenter Password:<br> <input type="text" id="RePassword" name="RePassword"><br> 
     <!-- Added id="" attribute to above 3 lines --> 
     <input type="submit" > 
    </form> 
    <p id="error_para" ></p> 
</body> 
</html>

Source

2016-10-03 11:35:48 Aks1357

-2

enfin, return true; à la fin de votre fonction

Source

2016-10-03 11:22:59 scraaappy

J'ai déjà essayé, mais le même résultat. –

C'est un correctif pour un bug dans sa méthode, mais ce n'est pas une solution à sa question. – Imaginaroom

Vous avez oublié d'ajouter IDS à tous les champs

<input type="text" name="userName" id="userName">

et ainsi ...

Source

2016-10-03 11:38:23

Je suggère également d'utiliser l'attribut required pour les entrées en HTML5.

<input type="text" id="userName" name="userName" required>

Il marque le champ soit obligatoire (comme son nom l'indique) et la forme ne nous soumettrons pas s'il n'y a pas de valeur en elle.

Source

2016-10-03 11:50:18 Imaginaroom

Merci. Obligatoire est utile mais en cas de mot de passe, vous ne pouvez pas l'utiliser. Donc opté pour la validation normale. –

Eh bien, pensez-y de cette façon, vous devez toujours avoir des champs de mot de passe et de re-mot de passe pour être requis, alors utilisez la fonctionnalité html5 pour cela. Pour les faire correspondre, vous pouvez utiliser javascript. Dans le développement web, il est toujours judicieux d'implémenter autant de niveaux de sécurité que possible. Dans ce cas 3, côté client en html et javascript, et un côté serveur, juste au cas où quelqu'un trouverait un moyen de contourner le problème. – Imaginaroom

Merci. Je les ai ajoutés aussi. –

validation de formulaire html ne fonctionne pas

Répondre

Questions connexes