Cet article partage la vérification du formulaire JavaScript avec tout le monde. Les données de formulaire typiques vérifiées par JavaScript sont :
L'utilisateur a-t-il rempli les champs obligatoires du formulaire ?
L'adresse e-mail saisie par l'utilisateur est-elle légale ?
L'utilisateur a-t-il saisi une date valide ?
L'utilisateur a-t-il saisi du texte dans le champ numérique ?
Éléments obligatoires (ou obligatoires)
La fonction suivante permet de vérifier si l'utilisateur a rempli les éléments requis (ou obligatoires) dans le formulaire. Si requis ou si le champ obligatoire est vide, une boîte d'avertissement apparaîtra et la valeur de retour de la fonction est fausse, sinon la valeur de retour de la fonction est vraie (ce qui signifie qu'il n'y a pas de problème avec les données) :
function validate_required(field,alerttxt) { with (field) { if (value==null||value=="") {alert(alerttxt);return false} else {return true} } }
Voici le code ainsi que le formulaire HTML :
<html> <head> <script type="text/javascript"> function validate_required(field,alerttxt) { with (field) { if (value==null||value=="") {alert(alerttxt);return false} else {return true} } } function validate_form(thisform) { with (thisform) { if (validate_required(email,"Email must be filled out!")==false) {email.focus();return false} } } </script> </head> <body> <form action="submitpage.htm" onsubmit="return validate_form(this)" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html>
Vérification des e-mails
La fonction ci-dessous vérifie si les données saisies sont conformes à la syntaxe de base d'une adresse email.
Cela signifie que les données saisies doivent contenir le symbole @ et le point (.). En même temps, @ ne peut pas être le premier caractère de l'adresse email, et il doit y avoir au moins un point après @ :
function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@") dotpos=value.lastIndexOf(".") if (apos<1||dotpos-apos<2) {alert(alerttxt);return false} else {return true} } }
Voici le code complet ainsi que le formulaire HTML :
Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à tout le monde d'apprendre la vérification des formulaires javascript.