un seul alert pour toutes les erreurs de validation d'un formulaire.

Soyez le premier à donner votre avis sur cette source.

Snippet vu 8 407 fois - Téléchargée 33 fois

Contenu du snippet

J'étatit en train de concevoir un site web ASP, qunad j'ai rencontré un problème de besoin d'un seul "alert" pour toutes les erreurs générées par la validation d'un formulaire de contact, en fait, c'était un nombre de problème, comment éviter d'ouvrir une nouvelle fenêtre de confirmation si le formulaire n'est pas bien rempli.

Même si le code semble simple mais j'avais pensé tellement à beaucoup de solutions que j'ai enfin testé celle-là qu'à parfaitement fonctionné avec moi dans un environnement: Windows XP - Internet Explorer 6.

Source / Exemple :


<html>	
<head>
<title>ajout</title>   
<meta name="generator" content="Namo WebEditor v5.0">
<script language="javascript"><!--

/*********************************************************************************** 

  • *
  • Ce code est gratuit d'utilisation et de distribution sous réserve *
  • de ne pas supprimer ces commentaires: *
  • Auteur: Farid email: sidoummoudz@yahoo.fr SteWeb: http://faridz.united.net.kg *
  • *
                                                                                                                                                                      • /
function ouvrir(){ //Cette fonction sera appelée plutard lafenetre=window.open("verifier.asp","lafenetre","height=300,width=550,scrollbars") } function validation (){ var lenom = document.all("nom").value; if (lenom == "") // Si le champ nom est vide { ecrire1="- Le champ nom doit être rempli"; // Dans l'alert on note } else // sinon { ecrire1="-------------------------------------------"; // à sa place pour éviter le vide } tele=document.all("tel").value; if (isNaN(tele)) // Si on viole la règle stricte des chiffres seulement { ecrire2="- Le champ téléphone ne doit comporter que des chiffres"; // Dans l'alert on note } else //Sinon { ecrire2="-------------------------------------------"; à sa place pour éviter le vide } capacite=document.laforma.message.value.length; if (capacite>255) //Si le nombre de caractère autorisé est dépassé (ici 255) { ecrire3="- Dépassement non autorisé de limite de 255 caractères car vous avez tapé:" +capacite+" caractères" } else //sinon { ecrire3="-------------------------------------------"; à sa place pour éviter le vide } if (capacite==0) //Si le champ message est vide (nombre de caractère 0) { ecrire4="- Le champ message ne doit pas rester vide" // Dans l'alert on note } else //sinon { ecrire4="-------------------------------------------"; // à sa place pour éviter le vide } /* Il est très important de souligner que vous devez écrire la même chose après les opérateurs que vous avez précédemment fait, par xemple si vous avez écrit pour le champ nom: ecrire1=""; dans ce cas vous écrivez pour ce-que suit: if (ecrire1!="" || etc.... alors imaginez si la faute est située enfin d'un formulaire composé de 10 champs ou plus, cela signifie que vous aurez un alert long plein de vide et qui pas vraiment joli*/ if (ecrire1!="-------------------------------------------" || ecrire2!="-------------------------------------------" || ecrire3!="-------------------------------------------" || ecrire4!="-------------------------------------------") // Si un seul cahmp est mal rempli{ // Je vous conseil aussi de ne pas sauter plus de ligne et juste aller à la ligne, c'est à dire ne pas mettre dans l'alert suivant \n\n ou plus mais juste \n comme mon éxemple. alert ("Veuillez réparer les fautes suivantes: \n\n"+ecrire1+"\n"+ecrire2+"\n"+ecrire3+"\n"+ecrire4) return false } else{ // Si le formulaire est bien complété ouvrir() /* on appele la fonction qui ouvrira une nouvelle fenêtre de confirmation de reception des données */ } } //Fin du script--></script> </head> <body > <center> <!-- le nom après target c'est le nom de la fêntre qui est la cible de la page de vérification qui nous transporte vers la page de confirmation ensuite en asp, php ou autre langage dynamique --> <form name="laforma" method="post" action="verifier.asp" onSubmit="return(validation())" TARGET="lafenetre" > <p align="center">Nom: <input type="text" name="nom"></center> <p align="center">Tel: <input type="text" name="tel">&nbsp;optionnel</p> <p align="center">Message: <textarea name="message" rows="5" cols="28"></textarea></p> <p align="center"><input type="submit" value="Envoyer" name="envoyer" > <input type="reset" value="Effacer" name="BClear"> </p> </form> <center> </body> </html>

Conclusion :


J'espère pouvroir réaliser un code plus efficace, car cela pour le moment c'est pour me débrouiler, et de toute façon merci de m'avertir si vous l'appréciez.

e-mail : sidoummoudz@yahoo.fr

A voir également

Ajouter un commentaire

Commentaires

maxprog
Messages postés
10
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
25 octobre 2005
-
mon problème est réglé je n'avais pas vue le onSubmit="return(validation())
maxprog
Messages postés
10
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
25 octobre 2005
-
J'ai un problème avec cette source. Je suis incappable de retracer mes données après avoir fait mon submit

merci
diduss
Messages postés
6
Date d'inscription
mercredi 26 janvier 2005
Statut
Membre
Dernière intervention
31 mai 2005
-
Le second code, plus complet est aussi plus précis, bravo à tous les deux, le premier pour l'idée et le début de solution, le second pour sa précision.

merci pour toutes vos propositions
Optitech
Messages postés
134
Date d'inscription
samedi 19 octobre 2002
Statut
Membre
Dernière intervention
3 janvier 2009
-
C'est une bonne idée de mettre tout les problème dans une même alert !

Mais je trouve que ton code est compliqué. Tu enregistre tout les problèem dans des variable différentes et après tu les rassembles dans l'alert.

Voila ce que je te propose pour s'implifier ton code :

<html>
<head>
<title>Inscription</title>
</head>



<script language="javascript">
<!--
function verif(){

var a = document.inscription.nom.value;
var b = document.inscription.prenom.value;
var c = document.inscription.pseudo.value;
var d = document.inscription.pass.value;
var e = document.inscription.pass2.value;
var f = document.inscription.mail.value;
var erreur=0;
var msg ="";
var verif = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]{2,}[.][a-zA-Z]{2,3}$/ // Pour verifier le format de l'adresse email

document.inscription.valide.value ="Patientez SVP..."; // Change le text du boutton de validation

if (a == "") { // Verifie que le champ nom n'est pas vide
msg += "- Vous avez oublié de mettre votre nom.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}

if (b == "") { // Verifie que le champ prenom n'est pas vide
msg += "- Vous avez oublié de mettre votre prénom.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}

if (c == "") { // Verifie que le champ pseudo n'est pas vide
msg += "- Vous avez pas choisi de pseudo.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}

if (d == "") { // Verifie que le champ pass n'est pas vide
msg +="- Vous avez oublié de mettre un mot de passe.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}

if (e == "") { // Verifie que le champ pass2 n'est pas vide
msg += "- Vous devez resaisir votre not de passe.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}else{
if (d != e){ // Verifie si le champ pass et pass2 on la même chose
msg += "- Vous n'avez pas saisis deux fois le même mot de passe.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}
}

if(f==""){ // Verifie que le champ mail n'est pas vide
msg += "- Vous n'avez pas mit d'adresse email.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}else{ // sinon
if (verif.exec(f) == null){ // Verifie le format de l'adresse email
msg += "- Le format de votre adresse e-mail est incorect.\n"; // Si le champ est vide on ajout ce message à la var msg sans efface ce qu'il y avait d'écrit avant
erreur++; // et +1 à la var erreur
}

}
if (erreur ==0){ // Verifie que la var erreur == 0
document.inscription.submit(); // Valide le formulaire
}else{
alert(msg); // Sinon affiche le ou les message d'erreurs
}
document.inscription.valide.value ="Valider"; // Change le text du boutton de validation
}
//-->
</script>
<form method="POST" action="valide.php" name="inscription">
Votre nom :*
Votre vrai nom

Votre prénom :*
Votre vrai prénom

<hr>Votre Pseudo :*
Choissisez un Pseudo

Votre mot de passe :*
Votre mot de passe

Resaisissez votre mot de passe :*
De nouveau votre mot de passe

Votre adresse e-mail :*
Votre adresse e-mail

<hr><center> </center>
</form>

</html>

Bien sûr il ne corespond pas a ton fomulaire ! Mais regarde le javascript. J'enregistre totu els message d'erreur dans une seulle variable et je n'efface pas la varraible à chque fois.

Bonne programation !

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.