Formulaire

Fermé
-
Messages postés
2653
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
26 janvier 2022
-
J'ai creer un formulaire en html avec nom prenom email mot de passe.

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="script2.js"></script>
</head>

</head>

<form>
   <p>Nom   <input type="text" name="nom" /></p>
   <p>Prénom   <input type="text" name="prenom" /></p>
   <p>E-mail   <input type="text" name="email" /></p>
   <p>Mot de passe   <input type="password" name="passe" value="azerty"></p>
   
</form>

</html> 


J'aimerai que quand je quitte un champ une fonction javascript vérifie le contenu. si le contenu est valide rien ne se passe et si il est pas valide la bordure du champ devient rouge et un message d erreur affiche une fenetre pop-up et le curseur revient dans le champ invalide.

les conditions pour nom et prénom c est au moins 2 lettre
pour le mail verifier la présence du @ et du point et pour le mot de passe au moins 6 caractères

EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici :
https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

Merci d'y penser dans tes prochains messages.
.

2 réponses

Messages postés
34716
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 janvier 2022
4 001
Bonjour,

Regardes du côté de : https://www.w3schools.com/jsref/event_onblur.asp

Ensuite, pour réaliser tes tests .. tu peux utiliser :
- la propriété length() pour connaitre le nombre de caractères
- et/ou les REGEX qui te permettrons aussi de faire le test sur la validité des adresses mail.

=> des tonnes d'exemples sont disponibles sur le net....
Messages postés
2653
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
26 janvier 2022
485
Salut,

A la place et/ou en complément des vérifications javascript, tu peux également utiliser la validation des formulaires avec HTML5.

Par exemple pour rendre obligatoire la saisie d'un mail valide :
<input type="email" name="email" required />

Pour obliger la saisie d'au moins deux lettres pour le pseudo :
<input type="text" name="prenom" pattern="[a-zA-Z]{2,}" required />


Plus d'info : https://www.alsacreations.com/tuto/lire/1370-formulaire-html5-placeholder-required-pattern.html

Bonne journée