Vérification pseudo qui ne marche pas

**Zenerox** · 14/11/2007, 10h35

Bonjour tout le monde.

Hier j'ai fait l'acquisition du livre " Javascript" de chez MicroApplication.
Je veux tester l'un de leurs exemple mail il me marche pas. J'ai pourtant recopié le livre.

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
 
<script type="text/javascript">
	function ajaxPseudo(f){
		var xhr_object = null;
		if (window.XMLHttpRequest){
			//pour Firefox
			xhr_object = new XMLHttpRequest(); 
			alert("Vous utilisez Firefox comme navigateur");
		}
		else if (window.ActiveXObject){
			//pour IE
			xhr_object = new ActiveXObject ("Microsoft.XMLHTTP");
			alert("Vous utilisez IE comme navigateur");
		}
		else {
			alert("Votre navigateur, c'est autre chose !");
			return;
		}
		var url="pseudo.php?pseudo="+escape(f.pseudo.value)+"&amp;ville="+escape(f.ville.value)+"&amp;annee="+escape(f.anne.value);
		xhr_object.open("GET", url, true);
		xhr_object.open.onreadystatechange = function(){
			if (xhr.object.readyState == 4){
				var reponse = xhr_object.responseText
				var regSeparateur=new RegExp(";", "g");
				var parties=reponse.split(regSeparateur);
				if (parties[0] == "CONTROLE_PSEUDO"){
					var div=document.getElementById("divControlePseudo");
					if (parties[1]=="OK"){
						div.innerHTML="Pseudo disponible";
						div.className="controleOK";
						div.style.display="";
					}
					else{
						var regSeparateurProposition=new RegExp(",","g");
						var propositions=parties[2].split(regSeparateurProposition);
						div.innerHTML="Pseudo réservé";
						if (parties[2] !=""){
							div.innerHTML+="<br /> Nous vous proposons : ";
						}
						for (var i=0;i<propositions.length ; i++){
							div.innerHTML+="<a href=\"javascript:choixPseudo('"+propositions[i]+"')\">
							"+propositions[i]+"</a>";
						}
						div.className="controleNOT_OK";
						div.style.display="";
					}
				}
			}
		}
		xhr_object.send(null);
	}
	function choixPseudo(proposition){
		document.monFormulaire.pseudo.value=proposition;
		ajaxPseudo(document.monFormulaire);
	}
</script>
<style type="text/css">
	body{
		font-family:arial;
		font-size:10pt;
	}
	label{
		width:250px;
		float:left;
	}
	.controleOK{
		margin-left:250px;
		color:#339966;
		font-weight:bold;
	}
	.controleNOT_OK{
		margin-left:250px;
		color:#FF0033;
		font-weight:bold;
	}
</style>
Inscrivez-vous :<br /><br />
<form name="monFormulaire">
<label>Indiquez votre ville :</label> <input type="text" name="ville" /><br />
<label>Indiquez votre année de naissance :</label> <input type="text" name="annee" /><br />
<label>Choisissez votre pseudo :</label> <input type="text" name="pseudo" onChange="ajaxPseudo(this.form)" /><br />
<div id="divControlePseudo" style="display:none" class="controleOK"></div>
</form>
<br />

Voyez vous le problème?
Ps : il manque un ";" à la fin de var reponse mais c'est comme ça dans le livre

**E.Bzz** · 14/11/2007, 12h37

Bonjour,
pourrais-tu préciser ce qui "ne marche pas" ?
Il y a une erreur JS (laquelle ?) ?
Ajax n'est pas appelé ?
Sa réponse n'est pas la bone ?
...

Déjà un petit problème de syntaxe (dépréciée) :

Code :

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

f.elements['pseudo'].value

au lieu de

Code :

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

f.pseudo.value

Mais pas sûr que ça vienne de là (à corriger quand même, et vérifier si ce n'est pas le cas ailleurs EDIT : c'est le cas ailleurs. Pour une référence par name, utilise systématiquement la syntaxe

Code :

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

document.forms['name_du_form'].elements['name_element'].propriete

)

A+

**Zenerox** · 14/11/2007, 12h46

Alors en fait c'est simple, je rentre un pseudo mais il ne se passe rien.
J'ai fait les modifs mais ça ne marche toujours pas

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
 
<script type="text/javascript">
	function ajaxPseudo(f){
		var xhr_object = null;
		if (window.XMLHttpRequest){
			//pour Firefox
			xhr_object = new XMLHttpRequest(); 
			alert("Vous utilisez Firefox comme navigateur");
		}
		else if (window.ActiveXObject){
			//pour IE
			xhr_object = new ActiveXObject ("Microsoft.XMLHTTP");
			alert("Vous utilisez IE comme navigateur");
		}
		else {
			alert("Votre navigateur, c'est de la merde !");
			return;
		}
		var url="pseudo.php?pseudo="+escape(forms['f'].elements['pseudo'].value)+"&amp;ville="+escape(forms['f'].elements['ville'].value)+"&amp;annee="+escape(forms['f'].elements['annee'].value);
		xhr_object.open("GET", url, true);
		xhr_object.open.onreadystatechange = function(){
			if (xhr.object.readyState == 4){
				var reponse = xhr_object.responseText;
				var regSeparateur=new RegExp(";", "g");
				var parties=reponse.split(regSeparateur);
				if (parties[0] == "CONTROLE_PSEUDO"){
					var div=document.getElementById("divControlePseudo");
					if (parties[1]=="OK"){
						div.innerHTML="Pseudo disponible";
						div.className="controleOK";
						div.style.display="";
					}
					else{
						var regSeparateurProposition=new RegExp(",","g");
						var propositions=parties[2].split(regSeparateurProposition);
						div.innerHTML="Pseudo réservé";
						if (parties[2] !=""){
							div.innerHTML+="<br /> Nous vous proposons : ";
						}
						for (var i=0;i<propositions.length ; i++){
							div.innerHTML+="<a href=\"javascript:choixPseudo('"+propositions[i]+"')\">
							"+propositions[i]+</a>";
						}
						div.className="controleNOT_OK";
						div.style.display="";
					}
				}
			}
		}
		xhr_object.send(null);
	}
	function choixPseudo(proposition){
		document.monFormulaire.pseudo.value=proposition;
		ajaxPseudo(document.monFormulaire);
	}
</script>
<style type="text/css">
	body{
		font-family:arial;
		font-size:10pt;
	}
	label{
		width:250px;
		float:left;
	}
	.controleOK{
		margin-left:250px;
		color:#339966;
		font-weight:bold;
	}
	.controleNOT_OK{
		margin-left:250px;
		color:#FF0033;
		font-weight:bold;
	}
</style>
Inscrivez-vous :<br /><br />
<form name="monFormulaire">
<label>Indiquez votre ville :</label> <input type="text" name="ville" /><br />
<label>Indiquez votre année de naissance :</label> <input type="text" name="annee" /><br />
<label>Choisissez votre pseudo :</label> <input type="text" name="pseudo" onChange="ajaxPseudo(this.form)" /><br />
<div id="divControlePseudo" style="display:none" class="controleOK"></div>
</form>
<br />

**E.Bzz** · 15/11/2007, 11h16

Envoyé par Zenerox

J'ai fait les modifs mais ça ne marche toujours pas

Oui, mais "f" est ton objet formulaire (et non son name).

Code :

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

forms['f'].elements['pseudo'].value

n'est donc pas correcte. C'est plutôt

Code :

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

f.elements['pseudo'].value

ou

Code :

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

forms['monFormulaire'].elements['pseudo'].value

mais dans ce cas tu n'utilises plus ton param de la fonction.

Si ça ne marche toujours pas, vérifie que l'url

Code :

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

pseudo.php?pseudo="+escape(forms['f'].elements['pseudo'].value)+"&amp;ville="+escape(forms['f'].elements['ville'].value)+"&amp;annee="+escape(forms['f'].elements['annee'].value

tappée dans la barre d'adresse du nav (avec des valeur réalistes, bien sûr) te répond, et avec le résultat attendu.
Sinon, tes passage <script> et <style> sont-ils bien dans le <head> de ta page. Dans le code donné, ça ne semble pas être le cas ...

A+

Vérification pseudo qui ne marche pas

JavaScript

Discussions similaires

Partager

Partager