verifier que tout les champs du formulaire sont remplis

Version imprimable

Bonjour a tous,

Je block:
Pour des besoin de base de données et d'ergonomie j'ai besion d'ètre sure que mon utilisateur a remplis au moins un champs dans le formulaire avant de vérifier si il a rempli un champs précis je pensais que sa allaite être simple avec les source trouvé dans les faq mais sa ne marche pas, j'ai essayé dans un formulaire hyper simple, sa ne marche toujours pas. voila mon code:
Code:

1 2 3 4 5 6 7 8 9 <form name="saisie" method="post" onsubmit="verif()"> <input type="text" name="nom" id="nom"><br/> </html> <input type="text" name="prenom" id="prenom"><br/> <input type="text" name="age" id="age"><br/> <input type="submit" value="valider"> </form>
sa c'est le formulaire, ultra basique que j'ai crée pour m'en sortir
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 function verif() { var inputList = document.forms['monFormulaire'].elements; var alertTxt = ""; for (unInput in inputList) { if(unInput.type=="text" && unInput.value.length==0) { alertTxt += "Le champ " + unInput.name + " n'a pas été rempli \n"; } } alert(alertTxt) }
et sa c'est la fonction que j'ai trouvé dans les faq et que je modifierais avec des booléeens quand elle marcheras.
si quelqu'un voit l'erreur.
Merci d'avance.

15/06/2009, 16h53
SpaceFrog

http://www.developpez.net/forums/d55...on-formulaire/
15/06/2009, 17h24
dirty_harry

Merci beaucoup pour ce lien qui me serra très utile j'essérai d'en faire bonne usage.

Bonne journé

J'avais en faite crié a la victoire un peu vite, si le code de l'autre post marche je ne peut pas l'adapter a mon cas car mon formulaire contient des champs qui ont des noms dynamiques, j'ai trouvé un post qui explique plus ou moin comment faire http://www.developpez.net/forums/d55...on-formulaire/ mais encore une fois c'est pas facile a adapter et la fonction ne marche pas. ce que je voudrais c'est vérifié si l'utilisateur a remplis au moin une case déstiné au variable, si c'est la cas on verifie si il a rempli la case déstiné à l'année de référence si ces deux conditions sont remplis on peut charger une nouvelle page, si l'utilsateur n'a rempli aucune case destiné au variable on peut chargé directement.

La ou je bloque c'est a la vérification qu'au moin une case variable(qui a pour name et id varxyz avec xyz 3 chiffres variables) a été remplis: voila ma fonction:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 function gopage(page, anneeref, formulaire) { var estRempli=false; for(var i=0 ; i<formulaire ; i++)//premier paramètre variable { for(var j=0 ; j<7 ; j++)//deuxième paramètre variable { for(var k=0 ; k<25 ; k++)//troisième paramètre variable { var form = 'var'+k+j+i; if(document.forms['saisie'].elements[form].value!='') { estRempli=true; } } } } if(estRempli==true) { if(document.getElementById(anneeref).value == "" ) { alert ('Vous avez oublié de saisir l\'année de réference!'); //return false; } else { document.saisie.action = page; document.saisie.submit(); } } }
et voila le formulaire (enfin juste la balise formulaire et les boutons):
Code:

1 2 3 4 5 <form name="saisie" id="saisie" method="post" action="" onsubmit="return testsubmit()"> <input type="button" value="insérer ces données" onclick="gopage('index.php?action=ajoutdonne&', 'AnneeRef1','1')" /> <input type="button" value="Suivant>>" onclick="gopage('index.php?action=affichedonne&donneeEnv=oke&', 'AnneeRef1','1')" />
d'apres les tests que j'ai fait avec les alert sa bloque au niveau du if.
j'ai fait pas mal de test je ne trouve pas comment faire.merci d'avance pour vos idées.

16/06/2009, 14h35
miniBob

salut,

tiens si tu veux j'ai fait dernièrement une vérification de formulaire avec du javascript, j'active le bouton de soumission qu'une fois que les 4 premiers champs sont remplis correctement.

En modifiant les fonctions tu pourrais surement arriver ou tu veux ;)
prend le code source : http://www.toopix.eu/inscription.html

désolé je passe en coup de vent, j'ai pas le temps de copier/coller tout le code intéressant je ferais ça ce soir ;)

ciao

Salut,

Poste un code complet et minimaliste illustrant ce que tu souhaites sous cette forme s'il te plaît :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>modèle de code pour bien poster</title> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <style type="text/css"> /* code css */ </style> </head> <body>  <script type="text/javascript">  </script> </body> </html>
Parce que entre ce que je ne vois pas le lien entre tu dis et ce que je vois comme code. Etant donné que le javascript bug, c'est surtout le formulaire qui compte.

Je vais essayer d'être le plus synthétique et le plus claire possible alors:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<body>
<script language="javascript">
function gopage(page, anneeref, formulaire)
{
 
	var estRempli=false;
	for(var i=0 ; i<formulaire ; i++)
	{
		for(var j=0 ; j<7 ; j++)
		{
 
			for(var k=0 ; k<25 ; k++)
			{
				var form = 'var'+k+j+i;
				alert(form);
				if(document.forms['saisie'].elements[form].value!='')
				{
					estRempli=true;
				}
 
 
			}
		}
	}
 
	if(estRempli==true)
	{
		if(document.getElementById(anneeref).value == "" )
		{
			alert ('Vous avez oublié de saisir l\'année de réference!');
			//return false;
		}
		else
		{
			document.saisie.action = page;
			document.saisie.submit();
		}
	}
}
</script>
<//code html concernant la mise en page-->
<form name="saisie" id="saisie" method="post" action="" onsubmit="return testsubmit()">
 
<//Element du formulaire sans importance ici-->
 
<label for=AnneeRef1>Année de Référence</label> <input type="text" size=5 name=AnneeRef1 id =AnneeRef1  > //année de référence
 
<//encore des élements du formulaire sans importance>
 
<td> <input type=text name='var111' id='var111'  size=5/></td>
<td> <input type=text name='var121' id='var121'  size=5/></td>
//les deux premières cases pour saisir les variables, les autres étant exactement pareil pendant longtemps
<input type="button" value="insérer ces données" onclick="gopage('index.php?action=ajoutdonne&amp;', 'AnneeRef1','1')" />
 
<div class="suivantPrincipal">
<input type="button" value="Suivant>>" onclick="gopage('index.php?action=affichedonne&amp;donneeEnv=oke&amp;', 'AnneeRef1','1')" />
</form>
</body>
</html>
 
</div>

Voila je ne sais pas si sa te parait plus clair comme sa, le formulaire marchait très bien jusqu'a maintenant c'est juste la fonction en javascript qui ne la reconait pas

16/06/2009, 15h15
SpaceFrog

Code:

<script type="text/javascript">

ça ne vient pas de la mais c'est mieux ...

Je te fais confiance sur l'utilité de toutes ces boucles ;). Il faut juste tester si l'élément voulu existe, sinon ça bug :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<body>
<form name="saisie" id="saisie" method="post" action="">
  <label for="AnneeRef1">Année de Référence</label>
    <input type="text" name="AnneeRef1" id="AnneeRef1" />
  <input type="text" name="var111" id="var111" />
  <input type="text" name="var121" id="var121" />
  <input type="button" value="insérer ces données" onclick="gopage('index.php?action=ajoutdonne&amp;', 'AnneeRef1','1')" />
  <input type="button" value="Suivant>>" onclick="gopage('index.php?action=affichedonne&amp;donneeEnv=oke&amp;', 'AnneeRef1','1')" />
</form>
<script language="javascript">
function gopage(page, anneeref, formulaire) {
	var estRempli=false;
	for(var i=0 ; i<=formulaire ; i++) {
		for(var j=0 ; j<7 ; j++) {
			for(var k=0 ; k<25 ; k++) {
				var form = 'var'+k+j+i;
        if(document.forms['saisie'].elements[form]) {
          if(document.forms['saisie'].elements[form].value!='') { estRempli=true; }
        }
			}
		}
	}
	if(estRempli) {
		if(document.getElementById(anneeref).value == "" ) {
			alert ('Vous avez oublié de saisir l\'année de réference!');
		} else {
			document.saisie.action = page;
			document.saisie.submit();
		}
	}
}
</script>
</body>
</html>

PS : tu devrais plus contrôler ton code client, c'était vraiment horrible à lire, mais j'y suis arrivé :D.

16/06/2009, 15h50
dirty_harry

Cette fois sa a l'air de marcher, merci beaucoup et bonne journée.

J'ai pas tout lu mais le début était bien parti. Fallait juste atteindre les bonnes valeurs:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
	var inputList = document.forms['monFormulaire'].elements;
	var alertTxt = "";
	for (unInput in inputList)
	{
		var x = document.forms['monFormulaire'].elements[unInput];
 
		if(x.value==0 || x.value=='')
		{
			alertTxt += "Le champ " + x.name + " n'a pas été rempli \n";
		}
	}
	alert(alertTxt)

Si ça peut servir aux prochains visiteurs...