tester un numero de téléphone dans <form>

**xess91** · 14/03/2009, 14h25

Bonjour,

je suis de passage sur le forum pour trouver un soutien à mon apprentissage du javascript, je débute et après avoir lu un tuto sur la vérification des formulaires j'ai tester de faire mon petit script mais sans résultat.

voila mon script:

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
	 		<script language="JavaScript">
function checknum() {
 
var mess = "erreur";
 
if (document.formulaire.tel.value != "")	{
var prefix = (document.formulaire.tel.value.substring(0,2));
var numero = (document.formulaire.tel.value);
var verif = numero.lenght;
if ((isNaN(numero))||(prefix != 01)&&(prefix != 02)&&(prefix != 03)&&(prefix != 04)&&(prefix != 05)&&(prefix != 06)) {
alert(numero.length);
}
}
}
</script>

J'édit mon post car je suis parvenu à un résultat en faisant des modifications parcontre je ne parviens toujours pas à calculer la longueur de la chaine, j'ai du mal avec les && et les || et les priorités à l'aide !!!!!!!!!!!!

voila donc le nom de mon champ étant "tel" parcontre veuillez m'excuser je n'ai pas trouvé les balises pour le script.
Merci d'avance !

**Bovino** · 14/03/2009, 16h34

Euh... tu veux juste tester un numéro de téléphone ???
Ton script n'est pas trop optimisé...

Code :

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

1
2
3
4
5
6
7
8
9
function checknum(num){
    var valide = /^0[1-6]\d{8}$/;
    if(valide.test(num){
        alert('Bon numéro !');
    }
    else{
        alert('Mauvais numéro !');
    }
}

Donc, tu crées une expression régulière avec 0 comme premier caractère, puis un chiffre entre 1 et 6 puis huit chiffres quelconques.
Ensuite, si ton champ correspond à cette expression c'est bon, sinon, c'est pas bon

**xess91** · 14/03/2009, 18h23

Merci bovino,

mais malheureusement il y un "mais", j'ai pas tout compris. 'avais vaguement entendu parler des expressions régulières mais je n'ai jamais abordé ce sujet, donc j'ai tout simplement copier/collé ta fonction j'ai fais juste un test avec "06abcdefg"et pas d'alerte donc j'ai pas bien saisie, peux tu me donner d'autre explication?

**emmanuel.remy** · 14/03/2009, 19h10

L'a tapé trop vite son exemple, il manque une parenthèse;

Code :

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

1
2
3
4
5
6
7
8
9
10
function checknum(num){
    var valide = /^0[1-6]\d{8}$/;
    if(valide.test(num)){
        alert('Bon numéro !');
    }
    else{
        alert('Mauvais numéro !');
    }
}

ERE

**xess91** · 14/03/2009, 19h16

Oui c'est ce que j'ai vu je l'ai modifié mais ça ne marche pas quand même, j'ai fais plusieurs tests notament avec 0122334455 et quelque soit le numéro saisie j'ai l'alert du mauvais numéro qui s'ouvre! moi plus comprendre!

**emmanuel.remy** · 14/03/2009, 19h36

C'est tout simplement impossible !

L'expression /^0[1-6]\d{8}$/ traduit exactement cela:

"la valeur de la chaine testée commence par un 0, suivi d'un chiffre de 1 à 6, suivi ensuite par exactement 8 chiffres"

Attention, aucune place à l'erreur: notamment pas d'espace ni au début ni à la fin, pas de point comme séparateur, etc...

Si cela ne marche toujours pas, poste ton code qu'on regarde où est ton erreur.

ERE

**xess91** · 14/03/2009, 20h51

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
	 		<script language="JavaScript">
function checknum(num){
    var valide=/^0[1-6]\d{8}$/;
    if(valide.test(num)){
        alert('Bon numéro !');
    }
    else{
        alert('Mauvais numéro !');
    }
}
</script>
 
<input type="text" name="tel" onblur="checknum('num');"/>

voila le code tel quel (copié/collé) encore merci.

edit: tout ça se passe en local j'ai pas essayé mis en ligne je vais tester tiens.
edit2: même en ligne rien y fait.

**emmanuel.remy** · 14/03/2009, 21h05

Tu passes une chaine 'num', il faut passer la valeur contenue dans la boite de texte:

Code :

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

1
2
<input type="text" name="tel" onblur="checknum(this.value);"/>

ERE

**xess91** · 14/03/2009, 21h15

arf! merci ERE, pour moi la fonction prennait en compte l'argument je suppose que c'est le même principe si je fait une expression régulière pour le champ mail ?

sinon j'avais fait ça pour le mail :

Code :

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

1
2
3
4
5
6
7
8
9
 
		if (document.formulaire.mail.value != "")	{
		indexAroba = document.formulaire.mail.value.indexOf('@');
		indexPoint = document.formulaire.mail.value.indexOf('.');
		if ((indexAroba < 0) || (indexPoint < 0))		{
		document.formulaire.mail.style.backgroundColor = "#cfe1fc";
			msg += "Le mail est incorrect\n";
		}
	}

Est que c'est optimal ?

**Bovino** · 14/03/2009, 22h18

@emmanuel.remy : Merci pour la correction

@ xess91 : Pour une adresse mail, c'est plus compliqué, il ne suffit pas de tester juste l'@ et le .
Une bonne regexp (c'est-à-dire qui prend en compte l'eesentiel, mais qui peut être mis à défaut si l'on prend en compte la syntaxe d'adresse la plus large...) :

Code :

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

var mail = /^[a-z0-9]([a-z0-9._-]*[a-z0-9])*@[a-z0-9]([a-z0-9._-]*[a-z0-9])*[.][a-z]{2,4}$/i;

**xess91** · 14/03/2009, 22h49

Bovino peux-tu me d'écrir ton expression régulière afin que j'en comprenne bien toute la suptilité ?

Merci d'avance. chouette ce forum

**Bovino** · 14/03/2009, 23h20

* ^commence par
* [a-z0-9] : un chiffre ou une lettre
* ( puis une sous chaine
* [a-z0-9._-]* chiffres, lettres, caractères '.', '_', '-'
* [a-z0-9] la sous chaine fini par une lettre ou un chiffre obligatoirement
* )* fin de la sous chaine, présente 0 fois ou plus
* le caractère '@'
* [a-z0-9]([a-z0-9._-]*[a-z0-9])* comme précédemment
* [.] un point
* [a-z]{2,4} entre 2 et 4 caractères alphabétiques
* $/ fin de la chaine
* i les caractères alphabétiques ne prennent pas en compte la casse (maj / min)

**xess91** · 15/03/2009, 17h17

je reviens sur l'expression régulière du téléphone actuellement elle tolère le 0 et de 1à6 pour les deux premiers numéros mais il y a certain fournissuer d'acces qui délivrent des numéros en 08 et 09 mais je ne pense pas 07 alors comment toléré tous les numéro sauf le 7?

Merci Bovino pour tes explications,

depuis hier je continu mon délire avec la vérification des champs d'un formulaire et la je viens poster une expression régulière pour tester un champ Prénom/Nom.

voila l'expression ce que j'ai fait :

Code :

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

var expressionreguliere = /^[a-zA-Z-]{2,}\b[a-zA-Z]{2,}$/;

^:début de l'expression;
[a-zA-Z-]: (pour le prénom)tous les caractères alphabétique et le tiret ex: jean-michel
{2,}:les caractères précédents au moin 2fois;
\s: espace entre le prenom et le nom;
[a-zA-Z]: (pour le nom)tous les caractères alphabétique je ne sai pas comment faire pour les noms composés avec espace genre De Fontenay.
{2,}:les caractères précédents au moin 2fois;
$:fin de l'expression.

Elle n'est pas optimale peut-on m'aider à la finir?

**xess91** · 16/03/2009, 14h14

voila j'ai fais un nouveau script qui test si le champ est vide ou si il est correctement rédigé au moment de la soumission mais ça ne fonctionne pas pourquoi ?

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
function check() {
	var msg = "";
	var nomprenom =/^[a-zA-Z-]{2,}\s[a-zA-Z]{2,}$/;
 
		if (document.formulaire.np.value == "")	{
 
		document.formulaire.np.style.backgroundColor = "#cfe1fc";
		msg += "Veuillez saisir votre prénom et nom\n";
	}
 
	if(document.formulaire.np.value != nomprenom) {
	document.formulaire.np.style.backgroundColor = "#cfe1fc";
	msg += "Votre saisie du prénom et nom est incorrect\n";
	}
             }
<form method="" action="" onsubmit="return check();">

quelque soit les valeurs saisis j'ai le message de mauvaise saisie biensur la composition est quelque peu différente car au lieu de tester les valeurs avec un onblur dans les input je test dans le form avec un onsubmit. Vu que je débute je ne comprends pas pourquoi ça foncionne pas !

**Bovino** · 16/03/2009, 14h46

Comme dans les exemples que je t'ai déjà donnés, les comparaisons sur les expressions régulières se font avec la fonction test(), pas avec == :

Code :

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

if(!nomprenom.test(document.formulaire.np.value))

Sinon, pour le numéro de téléphone,

Code :

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

var valide = /^0[1-689]\d{8}$/;

autorise 01, 02, 03, 04, 05, 06, 08, 09

**Bovino** · 16/03/2009, 14h51

Pour les prénoms, une meilleure expression serait :

Code :

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

var nomprenom =/^[a-zA-Z]{2,}([\s-][a-zA-Z]{2,})?$/;

Le ? : 0 ou 1 fois l'expression entre parenthèses
[\s-] : un espace ou un trait d'union
[a-zA-Z]{2,} : au moins deux lettres

**xess91** · 16/03/2009, 18h17

Encore merci Bovino pour moi le sujet est clot. Je vais revenir éditer le post pour y mettre le script complet pour tester tout un formulaire de contact afin que d'autres puissent en bénéficier.

Vive Developpez.com

CHOSE PROMIS CHOSE DUE JE POSTE PLUSIEURS FONCTIONS QUI PERMETTENT DE VERIFIER LES CHAMPS D'UN FORMUALIRE:

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
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
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
 
 
<!--ici la couleur de base des champs-->
 
		function couleur(obj) 
			{
			obj.style.backgroundColor = "#FFFFFF";
			}
 
<!-ici une fonction qui marche avec onsubmit pour vérifier si les champs sont correctements remplis-->
 
		function check() 
			{
			var msg = "";
 
<!-- les expressions régulières-->
 
			var nomprenom =/^[a-zA-Z-]{2,}\s[a-zA-Z]{2,}$/;
			var phone =/^0[1-9]\d{8}$/;
			var mess =/^[a-zA-Z-]{2,}\s[a-zA-Z]{2,}$/;
 
<!-- vérification du champ prenom et nom-->
 
			if (document.formulaire.np.value == "")	
				{
				document.formulaire.np.style.backgroundColor = "#cfe1fc";
				msg += "Veuillez saisir votre prénom et nom\n";
				}
 
			if(document.formulaire.np.value != "") 
				{
				if(!nomprenom.test(document.formulaire.np.value)) 
					{
					document.formulaire.np.style.backgroundColor = "#cfe1fc";
					msg += "Votre saisie du prénom et nom est incorrect\n";
					}
				}
 
<!-- verification du champ mail-->
 
			if (document.formulaire.mail.value == "")	
				{
				msg += "Veuillez saisir votre mail\n";
				document.formulaire.mail.style.backgroundColor = "#cfe1fc";
				}
 
			if (document.formulaire.mail.value != "")	
				{
				indexAroba = document.formulaire.mail.value.indexOf('@');
				indexPoint = document.formulaire.mail.value.indexOf('.');
				if ((indexAroba < 0) || (indexPoint < 0))		
					{
					document.formulaire.mail.style.backgroundColor = "#cfe1fc";
					msg += "Votre saisie du mail est incorrect\n";
					}
				}
 
<!--verification du téléphone-->
 
			if (document.formulaire.tel.value == "")	
				{
				msg += "Veuillez saisir votre téléphone\n";
				document.formulaire.tel.style.backgroundColor = "#cfe1fc";
				}
 
			if(document.formulaire.tel.value != "") 
				{
				if(!phone.test(document.formulaire.tel.value)) 
					{
					document.formulaire.tel.style.backgroundColor = "#cfe1fc";
					msg += "Votre saisie du téléphone est incorrect\n";
					}
				}
 
<!--vérication du message-->
 
			if (document.formulaire.message.value == "")	
				{
				msg += "Veuillez saisir votre message\n";
				document.formulaire.message.style.backgroundColor = "#cfe1fc";
				}
 
			if(document.formulaire.message.value != "") 
				{
				if(!mess.test(document.formulaire.message.value)) 
					{
					document.formulaire.message.style.backgroundColor = "#cfe1fc";
					msg += "Votre saisie du message est incorrect\n";
					}
				}
 
			if (msg == "") return(true);
			else	
				{
				alert(msg);
				return(false);
				}
			}
<!-- réalisé avec  une aide de deux membres du forum un fonction pour chaque champ qui fonction avec un onblur et fait apparaitre les fameux icones vert ou rouge en fonction de la saisie correct ou incorrect-->
 
 
		function checknum(num)
			{
			var valide=/^0[1-9]\d{8}$/;
			var rep;
			rep = document.getElementById("ok");
			var rep2;
			rep2 = document.getElementById("non");
			if (document.formulaire.tel.value != "")	
				{
				if(valide.test(num))
					{
					rep.style.display = "" ;
					rep2.style.display = "none" ;
					document.formulaire.tel.style.backgroundColor = "#FFFFFF";
					}
				else
					{
					rep2.style.display = "" ;
					rep.style.display = "none" ;
					document.formulaire.tel.style.backgroundColor = "#cfe1fc";
					}
				}
			else 
				{
				rep.style.display = "none" ;
				rep2.style.display = "none" ;
				document.formulaire.tel.style.backgroundColor = "#FFFFFF";
				}
			}
 
		function checkmail() 
			{
			var msg = "";
			var rep3;
			rep3 = document.getElementById("ok2");
			var rep4;
			rep4 = document.getElementById("non2");
			if (document.formulaire.mail.value != "")	
				{
				indexAroba = document.formulaire.mail.value.indexOf('@');
				indexPoint = document.formulaire.mail.value.indexOf('.');
				if ((indexAroba < 0) || (indexPoint < 0))		
					{
					rep3.style.display = "none" ;
					rep4.style.display = "" ;
					document.formulaire.mail.style.backgroundColor = "#cfe1fc";
					}
				else 
					{
					rep3.style.display = "" ;
					rep4.style.display = "none" ;
					document.formulaire.mail.style.backgroundColor = "#FFFFFF";
					}
				}
			else 
				{
				rep3.style.display = "none" ;
				rep4.style.display = "none" ;
				document.formulaire.mail.style.backgroundColor = "#FFFFFF";
				}
			}
 
		function checknom(nom)
			{
			var valide=/^[a-zA-Z-]{2,}\s[a-zA-Z]{2,}$/;
			var rep5;
			rep5 = document.getElementById("ok3");
			var rep6;
			rep6 = document.getElementById("non3");
			if (document.formulaire.np.value != "")	
				{
				if(valide.test(nom))
					{
					rep5.style.display = "" ;
					rep6.style.display = "none" ;
					document.formulaire.np.style.backgroundColor = "#FFFFFF";
					}
				else
					{
					rep6.style.display = "" ;
					rep5.style.display = "none" ;
					document.formulaire.np.style.backgroundColor = "#cfe1fc";
					}
				}
			else 
				{
				rep5.style.display = "none" ;
				rep6.style.display = "none" ;
				document.formulaire.np.style.backgroundColor = "#FFFFFF";
				}
			}
 
		function checkmess(mes) 
			{
			var val =/^((.+)\s(.+))+$/;
			var rep7;
			rep7 = document.getElementById("ok4");
			var rep8;
			rep8 = document.getElementById("non4");
			if (document.formulaire.message.value != "")	
				{
				if(val.test(mes))
					{
					rep7.style.display = "" ;
					rep8.style.display = "none" ;
					document.formulaire.message.style.backgroundColor = "#FFFFFF";
					}
				else 
					{
					rep7.style.display = "none" ;
					rep8.style.display = "" ;
					document.formulaire.message.style.backgroundColor = "#cfe1fc";
					}
				}
			else 
				{
				rep7.style.display = "none" ;
				rep8.style.display = "none" ;
				document.formulaire.message.style.backgroundColor = "#FFFFFF";
				}
			}