[js] mauvais formulaire validé

**will89** · 20/03/2007, 11h50

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**E.Bzz** · 20/03/2007, 11h54

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+

**will89** · 20/03/2007, 12h09

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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...

**E.Bzz** · 20/03/2007, 12h17

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+

**will89** · 20/03/2007, 12h18

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....

**E.Bzz** · 20/03/2007, 12h19

Aaahh !
Si j'avais un massage à chaque fois que j'ai une erreur de code, je serais content, moi

**will89** · 20/03/2007, 12h20

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...

**E.Bzz** · 20/03/2007, 12h25

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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+

**will89** · 20/03/2007, 12h36

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

Boutons radios :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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...

**will89** · 20/03/2007, 12h46

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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; }

**E.Bzz** · 20/03/2007, 13h48

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Autre solution (sans id

)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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+

**will89** · 20/03/2007, 14h38

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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; }

[js] mauvais formulaire validé

JavaScript

Discussions similaires

Partager

Partager