formulaire IE et Firefox

**sasuke001** · 21/06/2009, 22h06

Bonjour,
Je suis débutant en javascript et j'ai un souci avec mon code

Alors j'ai un formulaire d'inscription avec un contrôle côté client en JavaScript qui fonctionne très bien sous IE mais pas sur Firefox et pas moyen de trouver mon erreur... Je fais donc appelle à vous

Voici mon code HTML:

Code xhtml :

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
64
65
66
67
68
69
<form id="Form_inscri" action="traitement.php" method="post"onsubmit="return verifForm(this);">
 
        <div class="titreForm">Informations personnelles</div>
        <p>
            <label for="prenom">Prénom : </label>
            <input type="text" id="prenom" name="prenom" onblur="verifPrenom(this);"/>
        </p>
        <p>
            <label for="nom">Nom : </label>
            <input type="text" id="nom" name="nom" onblur="verifNom(this);" />
        </p>
        <p>
            <label for="date">Date de naissance : </label>
            <input type="text" id="date" class="date" name="date" value="JJ/MM/AAAA" onclick="date.value=''"onblur="verifDate(this);" />
        </p>
        <p>
            <label for="adresse">Adresse : </label>
            <input type="text" id="adresse" name="adresse" onblur="verifAdresse(this);" />
        </p>
        <p>
            <label for="code_postal">Code postal : </label>
            <input type="text" id="code_postal" name="code_postal" onblur="verifCp(this);" />
        </p>
        <p>
            <label for="ville">Ville : </label>
            <input type="text" id="ville" name="ville" onblur="verifVille(this);" />
        </p>
        <p>
            <label for="pays">Pays : </label>
            <select id="pays" name="pays">
					<option value="">&nbsp;</option>
					<option value="fr">France</option>
                <optgroup label="Amérique">
                    <option value="ca">Canada</option>
                    <option value="us">États-Unis</option>
                </optgroup>
                <optgroup label="Europe">
                    <option value="be">Belgique</option>
					<option value="es">Espagne</option>
                    <option value="fr">France</option>
                </optgroup>
            </select>
			<br />
        </p>
 
        <div class="titreForm">Mon compte</div>
        <p>
            <label for="login">Identifiant : </label>
            <input type="text" id="login" name="login" onblur="veriflogin(this);" />
        </p>
        <p>
            <label for="mot_de_passe">Mot de passe : </label>
            <input type="password" id="mot_de_passe" name="mot_de_passe" onblur="verifMdp(this);" />
        </p>
        <p>
            <label for="mot_de_passe2">Confirmer le mot de passe : </label>
            <input type="password" id="mot_de_passe2" name="mot_de_passe2" onblur="verifMdp2(this);"  />
        </p>
        <p>
            <label for="email">Adresse email : </label>
            <input type="text" id="email" name="email" onblur="verifMail(this);"/>
        </p>
 
    <p>
        <label class="clear">&nbsp;</label>
		<input type="submit" name="submit" value="Envoyer" title="Envoyer" /> 
		<input type="reset" name="del" value="Annuler" title="Annuler" />
    </p>
</form>

et mon code JS:

Code javascript :

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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
	function surligne(champ, erreur)
				{
					if(erreur)
						champ.style.backgroundColor = "#E6484D";
					else
						champ.style.backgroundColor = "";
				}
 
				function verifNom(champ)
				{
					var regexNom = /^[a-zA-ZÀ-ÿ-]{2,25}$/;
					if(!regexNom.test(champ.value))
					{
						surligne(champ, true);
					return false;
					}
					else
					{
						surligne(champ, false);
					return true;
					}
				}
 
				function verifPrenom(champ)
				{
					var regexPrenom = /^[a-zA-ZÀ-ÿ-]{2,25}$/;
					if(!regexPrenom.test(champ.value))
					{
						surligne(champ, true);
					return false;
					}
					else
					{
						surligne(champ, false);
					return true;
					}
				}				
 
				function verifDate(champ)
				{
					var regex = /^[0-9]{2}[/]{1}[0-9]{2}[/]{1}[0-9]{4}$/;
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
					return false;
					}
					else
					{
						surligne(champ, false);
					return true;
					}
				}	
 
				function verifMail(champ)
				{
					var regex = /^[a-zA-Z0-9._-]+@[a-z0-9._-]{2,}\.[a-z]{2,4}$/;
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}
 
				function veriflogin(champ)
				{
					var regex = /^[a-zA-Z0-9_-]{3,25}$/;
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}
 
				function verifMdp(champ)
				{
					var regex = /^[a-zA-Z0-9_-]{3,16}$/;
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}
 
 
				function verifMdp2(champ) 
				{
					mot_de_passe1 = Form_inscri.mot_de_passe.value;
					mot_de_passe2 = Form_inscri.mot_de_passe2.value;
					if ( mot_de_passe1 != mot_de_passe2 ) 	
					{
						alert('Vous n\'avez pas resaisi le meme mot de passe !');
						surligne(champ, true);
						return false;
					}
 
					else
					{
						surligne(champ, false);
						return true;
					}
				}
 
 
 
				function verifAdresse(champ) 
				{
					var regex = /^[a-zA-Z0-9ZÀ-ÿ-_'\s]{5,60}$/; 
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}	
 
				function verifCp(champ) 
				{
					var regex = /^[0-9]{5}$/; 
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}
 
				function verifVille(champ) 
				{
					var regex = /^[a-zA-ZZÀ-ÿ-_'\s]{2,60}$/; 
					if(!regex.test(champ.value))
					{
						surligne(champ, true);
						return false;
					}
					else
					{
						surligne(champ, false);
						return true;
					}
				}				
 
				function verifForm(f)
				{
					var nomOk = verifNom(f.nom);
					var prenomOk = verifPrenom(f.prenom);
					var dateOk = verifDate(f.date);
					var loginOk = veriflogin(f.login);
					var mdpOk = verifMdp(f.mot_de_passe);
					var mdp2Ok = verifMdp2(f.mot_de_passe2);
					var adresseOk = verifAdresse(f.adresse);
					var cpOk = verifCp(f.code_postal);
					var villeOk = verifVille(f.ville);
					var mailOk = verifMail(f.email);
 
					if(nomOk && prenomOk && dateOk && loginOk && mdpOk && mdp2Ok && adresseOk && cpOk && ville)
						return true
					else
					{
						alert("Veuillez remplir correctement tous les champs");
						return false;
					}
				}

Je vous remerci par avance et désolé pour l'indentation mais le copier/coller ne concerve pas celle-ci

**emmanuel.remy** · 21/06/2009, 22h17

Salut,

Ton formulaire n'a pas de name, et il faut référencer le formulaire par l'intermédiaire de document:

Code :

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

1
2
3
4
5
6
7
8
9
<form id="Form_inscri" name="Form_inscri" action="traitement.php" method="post"onsubmit="return verifForm(this);">

...
function verifMdp2(champ)
{
mot_de_passe1 = document.Form_inscri.mot_de_passe.value;
mot_de_passe2 = document.Form_inscri.mot_de_passe2.value;
if ( mot_de_passe1 != mot_de_passe2 )

Note qu'en règle générale il est mieux de faire le code pour Firefox et d'ajuster pour IE...

ERE

**andry.aime** · 22/06/2009, 07h57

Salut,
Tu peux aussi accéder directement aux éléments avec leur id:

Code :

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

1
2
3
4
5
6
7
...
function verifMdp2(champ)
{
mot_de_passe1 = document.getElementById('mot_de_passe').value;
mot_de_passe2 = document.getElementById('mot_de_passe2').value;
if ( mot_de_passe1 != mot_de_passe2 )
....

**franculo_caoulene** · 22/06/2009, 10h06

On ne connait pas le type de document, mais en xhtml1.0 strict, le formulaire ne doit pas contenir d'attribut name. Il est donc peut-être préférable d'utiliser les ids.

**sasuke001** · 22/06/2009, 22h44

J'ai essayé en référencent les éléments avec leur id mais rien ne change firefox n'accepte toujours pas! Mais la je ne vois pas du tout car mes fonctions sont relativement basique...

**andry.aime** · 23/06/2009, 08h02

mais pas sur Firefox et pas moyen de trouver mon erreur

Quelle fonction ne marche pas?
Javascript est activé dans ton Firefox?
Installe Firebug et décrit ce qu'il retourne.

formulaire IE et Firefox

JavaScript

Vue hybride

Discussions similaires

Partager

Partager