[AJAX] XMLHttpRequest fonctionne pas dans ie

Version imprimable

Alors la j'ai une belle boulette

L'objet xmlhttprequest est mal gerer dans ie des que je passe un parametre en javascript (le comble quand on sait que ca marche dans ff et que c'est microsoft qui a lance le produit enfin ...)

Je m'explique : sur le clic d'un bouton j'affiche une liste en fonction de son numero :

Code:

onClick=affichage();

et la fonction affichage :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 function affichage(){
			getXhr();
			// On défini ce qu'on va faire quand on aura la réponse
			xhr.onreadystatechange = function(){
				// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
				if(xhr.readyState == 4 && xhr.status == 200){
					leselect = xhr.responseText;
					// On se sert de innerHTML pour rajouter les options a la liste
					document.getElementById('liste').innerHTML = leselect;
				}
			}
 
			// Ici on va voir comment faire du post
			xhr.open("POST","list1.php",true);
			// ne pas oublier ça pour le post
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			// ne pas oublier de poster les arguments
			nl = document.getElementById('numliste');
			numliste = nl.options[nl.selectedIndex].value;
 
			xhr.send("aff=ok&numliste="+numliste);
		}

cela marche dans Firefox mais pas dans ie a cause je suppose du parametre (alors il y a t il une erreur de format ?)

car lorsque je passe un parametre en dur :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 function nouvelle(){
			getXhr();
			// On défini ce qu'on va faire quand on aura la réponse
			xhr.onreadystatechange = function(){
				// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
				if(xhr.readyState == 4 && xhr.status == 200){
					leselect = xhr.responseText;
					// On se sert de innerHTML pour rajouter les options a la liste
					document.getElementById('liste').innerHTML = leselect;
				}
			}
 
			// Ici on va voir comment faire du post
			xhr.open("POST","list1.php",true);
			// ne pas oublier ça pour le post
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			// ne pas oublier de poster les arguments	
 
			xhr.send("nouvelle=ok");
		}

ca passe dans les deux navigateur.
si qqun a deja rencontrer le probleme

au fait l'erreur generer par IE c'est

Citation:

cet objet ne gere pas cette propirete ou cette methode

26/09/2006, 08h21
rieppe

Salut,

Ta fonction getxhr ya moyen de la voir ?

Bien entendu !

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
var xhr = null; 
 
		function getXhr(){
			if(window.XMLHttpRequest) // Firefox et autres
			   xhr = new XMLHttpRequest(); 
			else if(window.ActiveXObject){ // Internet Explorer 
			   try {
						xhr = new ActiveXObject("Msxml2.XMLHTTP");
					} catch (e) {
						xhr = new ActiveXObject("Microsoft.XMLHTTP");
					}
			}
			else { // XMLHttpRequest non supporté par le navigateur 
			   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
			   xhr = false; 
			} 
		}

perso j'utilise ça qui marche sans souci ...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
	switch ( true ) {	
					case (!!window.XMLHttpRequest):
											ReqObj=new XMLHttpRequest();
											break;
 
					case  (!!window.ActiveXObject):
					            try {
                         ReqObj = new ActiveXObject("Msxml2.XMLHTTP");
                     } catch (e) {
                         ReqObj = new ActiveXObject("Microsoft.XMLHTTP");
                     }
											break;
 
					default :							alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
					  }

Ca, ça fonctionne sans problème également :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var xmlhttp = null;
try{
   xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e){
   try{
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   catch(e){
      xmlhttp = false;
   }
}
 
if(!xmlhttp && typeof XMLHttpRequest!='undefined'){
   xmlhttp = new XMLHttpRequest();
}

Je demande ca parce que j'ai eu un probleme de ce coté ^^

Ca aurait été bête que ca vienne de là.

Perso mon probleme était que ma variable XMLHTTPRequest était définie en globale et que je réutilisais toujours la même. Et c'est ce que je vois dans ton code ^_^.

J'ai aussi commencé avec le tuto de siddh et j'ai changé ensuite ma fonction suite aux conseils de Fremy.

J'ai maintenant ca :

Code:

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
// Renvoie le texte de l'objet ActiveXObject le plus récent depuis une liste
var pickRecentProgID = function (idList)
{
	// found progID flag
	var bFound = false;
	for(var i=0; i < idList.length && !bFound; i++)
	{
		try
		{
			var oDoc = new ActiveXObject(idList[i]);
			o2Store = idList[i];
			bFound = true;
		}
		catch (objException)
		{
			// trap; try next progID
		};
	};
	if (!bFound)
		throw ("Aucun ActiveXObject n'est valide sur votre ordinateur, pensez à mettre à jour votre navigateur");
	idList = null;
	return o2Store;
}
 
// Retourne un nouvel objet XmlHttpRequest
var GetXmlHttpRequest_AXO=null
var GetXmlHttpRequest=function () {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest()
	}
	else 
		if (window.ActiveXObject) 
		{
			if (!GetXmlHttpRequest_AXO) 
			{
				GetXmlHttpRequest_AXO=pickRecentProgID(["Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"]);
			}
			return new ActiveXObject(GetXmlHttpRequest_AXO)
		}
	return false;
}
 
// Compatibilité avec le tuto
getXhr=GetXmlHttpRequest;

26/09/2006, 12h23
tchoukapi

Perso j'ai utilise a 100% le tuto de siddh sur les combo liés et je l'adapte mais je vais essayé vos propositions car IE n'a pas l'air d'aimé ma methode xhr.send lorsque je lui passe des parametres variables et pas en dur .

J'ai essaye la methode de "bisounours" qui me semblait etre la meme que la mienne et effectivement car meme resultat .. snif

par contre je ne capte pas la solution de "SpaceFrog" ? tu ne fait pas de traitement dans le cas d'un naviguateur autre que IE ?

Code:

case (!!window.XMLHttpRequest):

et pour la solution de rieppe je n'arrive pas a l'implementer ... suis je nul (ne repondez pas oui !!) ;)
26/09/2006, 18h42
rieppe

Citation:

Envoyé par tchoukapi

et pour la solution de rieppe je n'arrive pas a l'implementer ...

Euh ben :O

Que dire que dire, j'ai eu aucun mal avec. Il y a la ligne

Code:

getXhr=GetXmlHttpRequest;

qui assure la cohérence entre la méthode du tuto et celle-ci.

J'essai de repasser demain pour mettre un exemple de code. (C'est l'heure de partir du taff ^_^ )
26/09/2006, 19h17
FremyCompany

La technique est simple, tu remplace la fonction getXhr par le code que rieppe t'a donné (c'est la première étape) et ensuite chaque fois que tu faisais "getXhr()" qqpart dans ton code, tu écrira dorénavant "var xhr=getXhr();"

Le travail n'est pas immense mais permet parfois d'éviter des problèmes (pouvant se produire dès que deux appels ajax sont lancés sur une même page)

Attention, tu dois aussi supprimer une ligne qui ressemble à "var xhr=null;" pour être certains que ca marche...

_______________

Une autre chose est qu'une URL est encodée...

Ca veut par exemple dire que les espace s'écrivent %20, que les A peuvent s'écrire %65, ... ainsi, si l'on passe des paramètres littéraux composé d'autre choses que de chiffres et de lettres ([a-z]|[A-Z]|[0-9])* non accentuées, il faut passer par un encodage... en javascript, il s'agit de la fonction escape()

xhr.send ("x=" + escape (x));
26/09/2006, 20h27
tchoukapi

je te remercie pour cette aide
ca devrait un peu mieux marche .
je vous tiens au courant .

-----------------------

Arf c'est quand meme dingue ca marche tjours pas dans IE.
Je fais deux appels XMLHttpRequest le premiere avec un parametre en dur :

Code:

xhr.send("aff=ok");

celle ci passe nickel

et la deuxieme que le parametre soit en dur ou en variable il passe pas .

il me met : "cet objet ne gere pas cette propriete ou cette methode" (dans IE)
cependant ca marche nickel dans FF
27/09/2006, 10h26
rieppe

Salut,

Ca parait bizarre quand même :/

Ya moyen de voir les dernieres versions de tes fonctions ? Avec paramétre en dur et sans parametre en dur ?

Biensur :

Code:

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
/* TROISIEME METHODE */
 
// Renvoie le texte de l'objet ActiveXObject le plus récent depuis une liste
var pickRecentProgID = function (idList)
{
	// found progID flag
	var bFound = false;
	for(var i=0; i < idList.length && !bFound; i++)
	{
		try
		{
			var oDoc = new ActiveXObject(idList[i]);
			o2Store = idList[i];
			bFound = true;
		}
		catch (objException)
		{
 
			// trap; try next progID
		};
	};
	if (!bFound)
		throw ("Aucun ActiveXObject n'est valide sur votre ordinateur, pensez à mettre à jour votre navigateur");
	idList = null;
	return o2Store;
}
 
// Retourne un nouvel objet XmlHttpRequest
var GetXmlHttpRequest_AXO=null;
var GetXmlHttpRequest=function () {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest()
	}
	else 
		if (window.ActiveXObject) 
		{
			if (!GetXmlHttpRequest_AXO) 
			{
				GetXmlHttpRequest_AXO=pickRecentProgID(["Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"]);
			}
			return new ActiveXObject(GetXmlHttpRequest_AXO)
		}
	return false;
}
 
// Compatibilité avec le tuto
getXhr=GetXmlHttpRequest;
 
 
	function affichage(){
			var xhr=getXhr();
			// On défini ce qu'on va faire quand on aura la réponse
			xhr.onreadystatechange = function(){
				// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
				if(xhr.readyState == 4 && xhr.status == 200){
					leselect = xhr.responseText;
					// On se sert de innerHTML pour rajouter les options a la liste
					document.getElementById('milieu').innerHTML = leselect;
				}
			}
 
			// Ici on va voir comment faire du post
			xhr.open("POST","requetes.php",true);
			// ne pas oublier ça pour le post
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			// ne pas oublier de poster les arguments		
			xhr.send("aff=ok");
		}
 
		function cnxToxcct(){
			var xhr=getXhr();
			// On défini ce qu'on va faire quand on aura la réponse
			xhr.onreadystatechange = function(){
				// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
				if(xhr.readyState == 4 && xhr.status == 200){
					leselect = xhr.responseText;
					// On se sert de innerHTML pour rajouter les options a la liste
					document.getElementById('milieu').innerHTML = leselect;
				}
			}
 
			// Ici on va voir comment faire du post
			xhr.open("POST","requetes.php",true);
			// ne pas oublier ça pour le post
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			// ne pas oublier de poster les arguments		
			pwd = document.getElementById('pwd').value;
			xhr.send("affBlog=Toxcct&pwd="+pwd);
		}

la methode affichage() est appelée sur un onClick() et permet d'ouvrir dans la meme page un texfield (pwd) avec un bouton go.
lors de l'appui sur ce bouton go la methode cnxToxcct() est appelé et permet d'affiché au meme endroit un lien.

Le premier click qui declenche la methode affichage fonctionne (dans IE et FF)
mais pas la deuxieme que ce soit avec ca :

Code:

xhr.send("affBlog=Toxcct&pwd="+pwd);

ou bien avec ca

Code:

xhr.send("affBlog=Toxcct");

par contre tout fonctionne dans FF

27/09/2006, 11h27
rieppe

Si tu fais un alert(pwd); avant ton xhr.send ca te donne bien la bonne valeur ?

EDIT : précision dans ta fonction cnxToxcct bien sur ^_^
27/09/2006, 11h37
tchoukapi

la alert balance bien le pwd dans FF
par contre meme boulette dans IE sauf que ca bug juste apres le :

Code:

pwd = document.getElementById('pwd').value;

quoiqu'il soit ecrit ! ca buguait sur un commentaire et la ca bug sur le caractere avant le alert(pwd);

on dirait que c'est

Code:

pwd = document.getElementById('pwd').value;

qui ne lui plait pas

apres un test ca pass sans erreur quand je degage ca :

Code:

pwd = document.getElementById('pwd').value;
27/09/2006, 11h39
rieppe

Et on élément dont l'id est 'pwd' est un <input type="text"> ?
27/09/2006, 11h45
tchoukapi

Trouvé !!

j'ai appelé mon champ comme ma variable :

Code:

<tr><td align=center><input class=inputtextfield type=password name=pwd id=pwd /></td></tr>

et ma variable :

Code:

pwd = document.getElementById('pwd').value;

alors il apprecie pas on dirait lol
j'ai changer le nom de mon champ et ca passe

la boulette de merde !!

Encore merci a tous de m'avoir aider !!