Page 1 sur 1

Faire un check de formulaire sur n champs

Posté : 24 mars 2011, 18:14
par foetus69
Bonjour,

Je voudrais savoir comment faire d'une pierre 2 coups mais je ne trouve pas la fonction adéquate.

Voilà la donne, dans un formulaire, j'ai 3 champs texte et 3 span cachés.

Le test consiste à savoir si tous les champs du formulaire sont renseignés et s'ils ne le sont pas d'afficher la mention "champ obligatoire".
<form name="monformulaire" id="monformulaire" method="post" onsubmit="test();">
<input type="text" name="nom" id="nom" /><span id="obliga" style="visibility:hidden">champ obligatoire</span><br />
<input type="text" name="prenom" id="prenom" /><span id="obliga" style="visibility:hidden">champ obligatoire</span><br />
<input type="text" name="age" id="age" /><span id="obliga" style="visibility:hidden">champ obligatoire</span><br />
<input type="submit" name="Envoyer" id="Tester" value="Tester" />
</form>
J'ai essayé :

Code : Tout sélectionner

function test(){ if(document.forms.length==0){ document.forms.getElementById("obliga").style.visibility.hidden==false; return false; } }
mais ca ne fonctionne pas :(

si je détaille à :
if(document.monformulaire.nom.value.length==0){
C'est ok.

Pourquoi ?

Est-ce que la démarche est bonne sinon ?

Merci de votre aide.

féfé

Re: Faire un check de formulaire sur n champs

Posté : 24 mars 2011, 22:00
par xTG
visibility n'a pas d'attribut hidden.
C'est la valeur de visibility qu'il faut modifier. ;)

Sinon pourquoi ne pas boucler sur tous les champs de ton formulaire ?
Tu peut pointer sur ton formulaire en lui mettant l'attribut name (par exemple = form) : document.forms['form']

Re: Faire un check de formulaire sur n champs

Posté : 24 mars 2011, 23:11
par sadeq
Bonjour voici un correctif à ton script HTML/JS.

Le script teste les champs du formulaire un par un par une boucle FOR et un IF. Quand la valeur d'un champ est vide on affiche le span du message "obligatoire" qui lui correspond. Pour cela chaque champ a un span de message "obligatoire" qui porte le nom du champ précédé par le mot "obliga_".
Ainsi, le champ "nom" par exemple a un span nommé "obliga_nom" qui lui correspond. Et de cette façon on peut contrôler l'affichage du message "obligatoire" champ par champ.

Voici le correctif:
<form name="monformulaire" id="monformulaire"  method="get" onsubmit="return test()" >
<p>Nom *<input type="text" name="nom" id="nom" /><span id="obliga_nom" style="visibility:hidden">champ obligatoire</span></p>
<p>Prénom *<input type="text" name="prenom" id="prenom" /><span id="obliga_prenom" style="visibility:hidden">champ obligatoire</span></p>
<p>Age *<input type="text" name="age" id="age" /><span id="obliga_age" style="visibility:hidden">champ obligatoire</span></p>
<p><input type="submit" name="Envoyer" id="Tester" value="Tester"  /></p>
</form>

<script>
function test()
{
	var valide = true; // variable de contrôle de validité des champs
	for (i=0; i<document.forms["monformulaire"].elements.length; i++)
	{
		var champ = document.forms["monformulaire"].elements[i]; // un champ du formulaire
		if (champ.value.length==0)  // si la valeur est vide
		{
			if (document.getElementById("obliga_" + champ.name))  // si le champ a un span portant son nom
			    document.getElementById("obliga_" + champ.name).style.visibility = "visible";  // afficher le span correspondant au champ car non valide
			valide = false;  // on note une erreur de validité de données
		}
		else 
		{ 
			if (document.getElementById("obliga_" + champ.name))  // si le champ a un span portant son nom
				document.getElementById("obliga_" + champ.name).style.visibility = "hidden";  // cacher le span car le champ est valide
		}
	}
	// retourne soit true pour continuer le submit ou false pour l'annuler
	 return valide;
}
</script>

Re: Faire un check de formulaire sur n champs

Posté : 26 mars 2011, 13:54
par foetus69
Bonjour et merci à tous les 2 (notamment à toi sadeq)

J'en demandais pas tant !!! C'est super gentil en tout cas.

Ton script marche vraiment bien, je vais l'éplucher dans tous les sens pour essayer de le refaire seule :)

Une nouvelle preuve que php france est le meilleur forum en la matière.

Bisous à vous et bon WE !

foetus69