problème avec readyState [Résolu]

helpcomm · 21/12/2007, 07h42

Salut,

J'ai besoin d'aide concernant l'utilisation de readyState. Je vous donne le code source (voir en bas du message) comme ca vous coomprendrez mieu le problème. Le but est de permettre à l'utilisateur de choisir la province dans une liste déroulante. Le fichier php ne fait que lire la requête qui a comme paramètre le choix qu'a fait l'utilisateur. Ensuite une alerte javascript permet d'afficher le message envoyé par le fichier php càd la valeur du choix du client. Maintenant la première ligne de stateChanged() est mise en commentaire, et c'est la le problème la deuxième alerte qui est sensée s'afficher ne s'affiche pas. Par contre si j'enlève les commentaire de cette ligne tout marche bien. Avez vous une suggestion?

Merci

Client:
=====

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<title>Ajax - PHP example</title>
 
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
     function showCity(prcode)
	 {
	 	xmlHttp = GetXmlHttpObject();
	 	url = "getcities.php";
	 	url=url+"?q="+prcode;
	 	url=url+"&sid="+Math.random();
	 	xmlHttp.open("GET", url,true);
	 	xmlHttp.send(null);
	 	xmlHttp.onreadystatechange = stateChanged();
	 }
 
	 function GetXmlHttpObject()
	 {
	 var xmlHttp=null;
	 try {
	   // Firefox, Opera 8.0+, Safari
	   xmlHttp=new XMLHttpRequest();
	 }
	 catch (e) {
	   // Internet Explorer
	   try{
	     xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
	   }
	   catch (e) {
	   	try {
	     	      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
	         }
	         catch (e) {
	           alert("Your browser does not support AJAX!");
	           return false;
	         }
	   }
	 }
	 return xmlHttp;
	 }
 
	 function stateChanged()
	 {
	 	//alert("executing stateChanged()");
	 	if(xmlHttp.readyState==4)  {
	   		alert("the response from the server: " + xmlHttp.responseText);
	   	}
	 }
-->
</script>
<form>
<select name="province" size="1" onChange = "showCity(this.value);">
	<option value="0">Choose province</option>
	<option value="1">Alberta</option>
	<option value="2">British Columbia</option>
	<option value="3">Manitoba</option>
	<option value="4">New Brunswick</option>
	<option value="5">Newfoundland</option>
	<option value="6">Northwest Territories</option>
	<option value="7">Nova Scotia</option>
	<option value="8">Nonavut</option>
	<option value="9">Ontario</option>
	<option value="10">Prince Edward Island</option>
	<option value="11">Quebec</option>
	<option value="12">Saskatchewan</option>
	<option value="13">Yukon</option>
</select>
</form>
</body>
</html>

serveur (getcities.php):
=================

Code :

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

1
2
3
4
<?php
$q=$_GET["q"];
echo "the quey is $q";
?>

E.Bzz · 21/12/2007, 14h14

Bonjour,

Citation:

Envoyé par helpcomm

Avez vous une suggestion?

ton alert() doit bloquer le fonctionnement du onreadystatechange qui récupère en dynamique l'état d'avancement de la requête Ajax.
Essaye

Code :

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

1
2
3
4
5
6
7
8
9
function stateChanged()
{
if(xmlHttp.readyState==4)  {
alert("the response from the server: " + xmlHttp.responseText);
}
else  {
alert("Etat actuel : " + xmlHttp.readyState);
}
}

Mais pas sûr que ça résolve le problème : ton alert() bloquera quand même le fonctionnement avant la bonne fin de ta requête Ajax ...

Plutôt qu'une alert(), essaye plutôt un

Code :

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

document.getElementById('id_d_un_div').innerHTML += "Etat actuel : " + xmlHttp.readyState + "<br />";

Il n'y aura ainsi plus de blocage du script ...

A+

helpcomm · 22/12/2007, 07h32

Salut,

Merci pour la réponse mais je n'arrive pas à faire fonctionner ça correctement. J'envoie la dernière partie du code (c'est la partie modifiée en fait). Tout ce que j'arrive à afficher c'est la première ligne que j'ai mise en commentaire qui affiche tout le temps l'état 1. Apparement l'état n'arrive jamais à 4.

Toute suggestion est la bienvenue.

Merci

========

function stateChanged()
{
//document.getElementById('txtHint').innerHTML += "Etat actuel : " + xmlHttp.readyState + "<br />";
if(xmlHttp.readyState==4) {
document.getElementById('txtHint').innerHTML += "Etat actuel : " + xmlHttp.readyState + "<br />";
}
}
-->
</script>
<form>
<select name="province" size="1" onChange = "showCity(this.value);">
<option value="0">Choose province</option>
<option value="1">Alberta</option>
<option value="2">British Columbia</option>
<option value="3">Manitoba</option>
<option value="4">New Brunswick</option>
<option value="5">Newfoundland</option>
<option value="6">Northwest Territories</option>
<option value="7">Nova Scotia</option>
<option value="8">Nonavut</option>
<option value="9">Ontario</option>
<option value="10">Prince Edward Island</option>
<option value="11">Quebec</option>
<option value="12">Saskatchewan</option>
<option value="13">Yukon</option>
</select>

<div id="txtHint"></div>
</form>
</body>
</html>

helpcomm · 22/12/2007, 08h00

J'ai trouvé l'erreur. c'était l'appel de la fonction de changement d'état qui n'était pas correct. il fallait garder la fonction comme suit: xmlHttp.onreadystatechange=function().

Merci

22/12/2007, 07h32	#3
helpcomm Membre du Club Inscription : novembre 2007 Messages : 132 Détails du profil Informations forums : Inscription : novembre 2007 Messages : 132 Points : 44 Points : 44	Salut, Merci pour la réponse mais je n'arrive pas à faire fonctionner ça correctement. J'envoie la dernière partie du code (c'est la partie modifiée en fait). Tout ce que j'arrive à afficher c'est la première ligne que j'ai mise en commentaire qui affiche tout le temps l'état 1. Apparement l'état n'arrive jamais à 4. Toute suggestion est la bienvenue. Merci ======== function stateChanged() { //document.getElementById('txtHint').innerHTML += "Etat actuel : " + xmlHttp.readyState + "<br />"; if(xmlHttp.readyState==4) { document.getElementById('txtHint').innerHTML += "Etat actuel : " + xmlHttp.readyState + "<br />"; } } --> </script> <form> <select name="province" size="1" onChange = "showCity(this.value);"> <option value="0">Choose province</option> <option value="1">Alberta</option> <option value="2">British Columbia</option> <option value="3">Manitoba</option> <option value="4">New Brunswick</option> <option value="5">Newfoundland</option> <option value="6">Northwest Territories</option> <option value="7">Nova Scotia</option> <option value="8">Nonavut</option> <option value="9">Ontario</option> <option value="10">Prince Edward Island</option> <option value="11">Quebec</option> <option value="12">Saskatchewan</option> <option value="13">Yukon</option> </select> <div id="txtHint"></div> </form> </body> </html>
	00

22/12/2007, 08h00	#4
helpcomm Membre du Club Inscription : novembre 2007 Messages : 132 Détails du profil Informations forums : Inscription : novembre 2007 Messages : 132 Points : 44 Points : 44	J'ai trouvé l'erreur. c'était l'appel de la fonction de changement d'état qui n'était pas correct. il fallait garder la fonction comme suit: xmlHttp.onreadystatechange=function(). Merci
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email