[js] mauvais formulaire validé

Version imprimable

Bonjour à tous, je comprends pas du tout pourquoi mon formulaire ets validé alors qu'il ne reponds à aucune des conditions requises lors de la validation...

Voici la fonction de verif :

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
<script language="JavaScript" type="text/JavaScript">
		<!--
		function test_saisie() {
		    var tag = 0;
			if (document.form_donnees_user.mail_client.value=="" || document.form_donnees_user.mail_client.value.indexOf("@") == "-1" || document.form_donnees_user.mail_client.value.indexOf(".") == "-1")  { 
				alert("Mauvaise saisie de l'adresse mail.");
				tag = 1; } 
			if (document.form_donnees_user.pass_client.value=="" || document.form_donnees_user.pass_client2.value=="" || document.form_donnees_user.pass_client.value!=document.form_donnees_user.pass_client2.value)  { 
				alert("Veuillez saisir le mot de passe et le confirmer.");
				tag = 1; } 
			if (document.form_donnees_user.pseudo_client.value=="")  { 
				alert("Veuillez saisir un pseudo.");
				tag = 1; }
			if(!form_donnees_user.titre_client.checked) {
				alert("Veuillez vous choisir un titre : M. Mme. ou Melle.");
				tag = 1; }
			if (document.form_donnees_user.jour_naissance_client.value < 1 || document.form_donnees_user.jour_naissance_client.value > 31 || document.form_donnees_user.jour_naissance_client.value == "jj")  { 
				alert("Mauvaise saisie du jour de naissance.");
				tag = 1; }
			if (document.form_donnees_user.mois_naissance_client.value < 1 || document.form_donnees_user.mois_naissance_client.value > 12 || document.form_donnees_user.mois_naissance_client.value == "mm")  { 
				alert("Mauvaise saisie du mois de naissance.");
				tag = 1; }
			if (document.form_donnees_user.annee_naissance_client.value < 1850 || document.form_donnees_user.annee_naissance_client.value == "aaaa")  { 
				alert("Mauvaise saisie de l'année de naissance.");
				tag = 1; }
			alert(tag);
			if (tag == 0) {alert(tag);document.form_donnees_user.submit();}
		}
		//-->
</script>

et voivi mon formulaire :

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
<form action="saisie_donnees_user_form.php?page=2" method="post" name="form_donnees_user" id="form_donnees_user">
	  <h3>Page <?php echo $page; ?> : informations personnelles</h3>
	  <table border="1">
		<tr>
		  <td>Adresse mail (elle vous servira de login) : </td>
		  <td><input name="mail_client" type="text" id="mail_client"></td>
		</tr>
		<tr>
		  <td>Mot de passe (entre 4 et 12 caract&egrave;res ) : </td>
		  <td><input name="pass_client" type="password" id="pass_client"></td>
		</tr>
		<tr>
		  <td>Confirmation du mot de passe : </td>
		  <td><input name="pass_client2" type="password" id="pass_client2"></td>
		</tr>
		<tr>
		  <td>Pseudo (entre 4 et 12 caract&egrave;res ) : </td>
		  <td><input name="pseudo_client" type="text" id="pseudo_client2"></td>
		</tr>
		<tr>
		  <td colspan="2"><p>Courte description de vous-m&ecirc;me : <br />        
			  <textarea name="description_client" cols="50" rows="3" id="description_client2"></textarea>
		  </td>
		</tr>
	  </table>
	  <p>  
	  <table border="1">
		<tr>
		  <td colspan="2"><input type="radio" name="titre_client" value="M.">M.
		  <input type="radio" name="titre_client" value="Mme.">Mme.
		  <input type="radio" name="titre_client" value="Melle.">Melle.</td>
		</tr>
		<tr>
		  <td>Date de naissance : </td>
		  <td><input name="jour_naissance_client" type="text" id="date_naissance_client" value="jj" size="2" maxlength="2"> 
		  / 
		  <input name="mois_naissance_client" type="text" id="date_naissance_client" value="mm" size="2" maxlength="2"> 
		  / 
		  <input name="annee_naissance_client" type="text" id="date_naissance_client" value="aaaa" size="4" maxlength="4"></td>
		</tr>
		<tr>
		  <td>Pays : </td>
		  <td><select name="pays_client" id="pays_client">
			<?php do {
                        echo "<option value=".$infos_pays->pays." ";
                        if ( $infos_pays->pays == France ) echo "selected";
                        echo ">".$infos_pays->pays."</option>";
                        } while ($infos_pays = mysql_fetch_object($pays)); ?>
		  </select></td>
		</tr>
		<tr>
		  <td>D&eacute;partement (si France) : </td>
		  <td><select name="departement_client" id="departement_client">
		  	<option value=""></option>
			<?php do {
                        echo "<option value=".$infos_departement->departement.">".$infos_departement->num_departement."-".$infos_departement->departement."</option>";
                        } while ($infos_departement = mysql_fetch_object($departement)); ?>
		  </select></td>
		</tr>
	  </table>
	  <input name="envoyer1" type="submit" value="Page suivante" onClick="test_saisie();";/>
	  </p>
	</form>

Ce que je comprends encore moins c'est que la fonction me detecte toutes les erreurs et pourtant j'arrive quand même sur la deuxième page du formulaire... malgré que le script ne rentre pas dans la derniere conditionnelle puisque tag vaut alors 1 et non 0...

Merci d'avance à ceux qui m'aiderait et aux autres aussi :D

20/03/2007, 11h54
E.Bzz

Bonjour,
il faut appeler ta fonction test_saisie() sur le onsubmit du form.
Il faut que ta fonction return true si test OK (=> submit) et false si KO (=> submit annulé).

A+

J'ai essayé cette solution mais ça ne fonctionne pas parfaitement...
Mon formulaire est séparé en deux tableaux et quand la fonction detecte une erreur dans le premier elle renvoie sur la bonne page mais quand elle en detecte une dans le deuxieme elle passe quand meme à la page d'après...
En gros ça pose probleme à partir du test de titre_client, qui est un bouton radio...

Voici un aperçu du code de ma nouvelle 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
37
function test_saisie() {
			if (document.form_donnees_user.mail_client.value=="" || document.form_donnees_user.mail_client.value.indexOf("@") == "-1" || document.form_donnees_user.mail_client.value.indexOf(".") == "-1")  { 
				alert("Mauvaise saisie de l'adresse mail.");
				document.form_donnees_user.mail_client.focus();
   				return false; }
				else
			if (document.form_donnees_user.pass_client.value=="" || document.form_donnees_user.pass_client2.value=="" || document.form_donnees_user.pass_client.value!=document.form_donnees_user.pass_client2.value)  { 
				alert("Veuillez saisir le mot de passe et le confirmer.");
				document.form_donnees_user.pass_client.focus();
   				return false; }
				else 
			if (document.form_donnees_user.pseudo_client.value=="")  { 
				alert("Veuillez saisir un pseudo.");
				document.form_donnees_user.pseudo_client.focus();
   				return false; }
				else
			if(!form_donnees_user.titre_client.checked) {
				alert("Veuillez vous choisir un titre : M. Mme. ou Melle.");
				document.form_donnees_user.titre_client.focus();
   				return false; }
				else
			if (document.form_donnees_user.jour_naissance_client.value < 1 || document.form_donnees_user.jour_naissance_client.value > 31 || document.form_donnees_user.jour_naissance_client.value == "jj")  { 
				alert("Mauvaise saisie du jour de naissance.");
				document.form_donnees_user.jour_naissance_client.focus();
   				return false; }
				else
			if (document.form_donnees_user.mois_naissance_client.value < 1 || document.form_donnees_user.mois_naissance_client.value > 12 || document.form_donnees_user.mois_naissance_client.value == "mm")  { 
				alert("Mauvaise saisie du mois de naissance.");
				document.form_donnees_user.mois_naissance_client.focus();
   				return false; }
				else
			if (document.form_donnees_user.annee_naissance_client.value < 1850 || document.form_donnees_user.annee_naissance_client.value == "aaaa")  { 
				alert("Mauvaise saisie de l'année de naissance.");
				document.form_donnees_user.annee_naissance_client.focus();
   				return false; }
			return true;
		}

Sachant que dans la balise form j'ai rajouté : onSubmit="return test_saisie()" et ke j'ai supprimé le onClick du bouton Page Suivante...

20/03/2007, 12h17
E.Bzz

Citation:

Envoyé par will89

En gros ça pose probleme à partir du test de titre_client, qui est un bouton radio...

Celui où tu as oublié le "document." dans le test ? ;)

A+
20/03/2007, 12h18
will89

Le probleme vient en fait du test pour verifier qu'un titre a bien été choisi... en effet même si j'en selectionne un... le massage d'erreur est affiché... Ce qui n'est pas cool.... 8O
20/03/2007, 12h19
E.Bzz

Aaahh !
Si j'avais un massage à chaque fois que j'ai une erreur de code, je serais content, moi :D
20/03/2007, 12h20
will89

Citation:

Envoyé par E.Bzz

Celui où tu as oublié le "document." dans le test ? ;)

A+

Je l'ai rajouté... pas bête. Mais ça marche pas quand même... :?
20/03/2007, 12h25
E.Bzz

Code:

document.forms['form_donnees_user'].titre_client.checked

?

Sinon, je te conseille d'utiliser plutôt les ID pour faire référence à tes objets !

.... et d'ailleurs, en l'écrivant je m'aperçoit que tu as (forcément) plusieurs objets "titre_client" pour le choix : ça vient de là !
==> mets des ID dans tes radios et teste le checked pour tous ...

A+

Si j'ai bien compris voilà ce que ça donne :

Boutons radios :

Code:

1
2
3
<input type="radio" name="titre_client" value="M." id="mr">M.
		  <input type="radio" name="titre_client" value="Mme." id="mme">Mme.
		  <input type="radio" name="titre_client" value="Melle." id="melle">Melle.

Fonction de test :

Code:

1
2
3
4
5
6
7
if(!document.forms["form_donnees_user"].titre_client["mr"].checked) {
				if(!document.forms["form_donnees_user"].titre_client["mme"].checked) {
					if(!document.forms["form_donnees_user"].titre_client["melle"].checked) {
						alert("Veuillez vous choisir un titre : M. Mme. ou Melle.");
						return false; }
				}
			}

Mais hélas ça fonctionne toujours paq correctement...:evilred:

J'ai essayé ça aussi si ça peut donner une piste à quelqu'un :

Code:

1
2
3
if(document.form_donnees_user.titre_client.value != "M." || document.form_donnees_user.titre_client.value != "Mme." || document.form_donnees_user.titre_client.value != "Melle.") {
				alert("Veuillez vous choisir un titre : M. Mme. ou Melle.");
				return false; }

Heu ... oui mais non !
L'id se gère différemment du name :

Code:

1
2
if (!document.getElementById('mme').checked && !document.getElementById('mlle').checked)
...

Autre solution (sans id ;) )

Code:

1
2
3
4
5
6
7
trouve=false;
for (i=0; i<document.getElementsByName("titre_client").length && !trouve; i++)
trouve = document.getElementsByName("titre_client")[i].checked;
if (!trouve) {
alert();
return false;}
else return true;

A+

20/03/2007, 14h38
will89
J'ai encore plus simple.... Et aussi simple à vérifier qu'un simple champ texte... J'ai utilisé une liste déroulante qui propose par défaut un champ vide et les trois valeurs : Mr. Mme. et Melle.
Dans test_saisie() je fais tout bêtement :
Code:

1 2 3 4 if (document.form_donnees_user.titre_client.value=="") { alert("Veuillez choisir un titre : M. Mme. Melle."); document.form_donnees_user.pseudo_client.focus(); return false; }