[AJAX] Ajax sous internet explorer 7

**leoche** · 15/03/2007, 15h25

Bonjour,

alors voila j'ai vouu faire un petit test tres simple avec de l'ajax, le code marche tres bien sous firefox, mais pas sous ie7, reconnaissais vous ce type de probleme : il ne se passe strictement rien sous ie 7...

vous pouvez constater par vous meme : http://prisonbreaklew.free.fr/testajax/progress2.php

voila... merci d'avance a tous !!

mon code :
progress2.php:

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
 
 
<script type="text/javascript" language="javascript">
/*
    Construit la requête xmlHttpRequest 
*/
function test() {
 
    var xhr = null;
 
	if(window.XMLHttpRequest) // Firefox
		xhr = new XMLHttpRequest();
	else if(window.ActiveXObject) // Internet Explorer
		xhr = new ActiveXObject("Microsoft.XMLHTTP"); 
	else 
	{ // XMLHttpRequest non supporté par le navigateur
		alert("Erreur");
		return;
	}
 
 
     xhr.onload=tcb; ////la fonction de rappel qui gère la réponse du serveur
    //la requête est envoyé en mode asynchrone(paramètre true) pour éviter de geler le navigateur
     xhr.open("GET","test.php",true);
     xhr.send(null);
}
 
function tcb() {
 
   var repXhr=this.responseText; //récupération de la réponse du serveur via l'objet xmlHttpRequest (this)
   document.getElementById("fr").innerHTML = "ça marche !!!" + repXhr;
 
}
</script>
<span
    style="cursor: pointer; text-decoration: underline"
    onclick="test()">
        Effectuer une requête
</span>
<div id="fr">
</div>

test.php:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<?php
header('Content-type: text/plain; charset=UTF-8');
 
 
    echo (" One two");
        exit;
 
 
 
?>

**leoche** · 16/03/2007, 10h44

en fait je crois que le probleme viens du onload... kelk'un a une idée ???

**fross** · 16/03/2007, 13h31

remplace ton xht.onload par ca :

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
 
xhr.onreadystatechange = function() { 
	//on affiche la barre de progression
	try {
		if (xhr.readyState == 4) {
			if (xhr.status == 200) {
				tcb(xhr.responseText);
			}else{
				alert("Une erreur est survenue sur la page PHP");
			}
		}else{
			alert("Transfert en cours : "+ xhr.readyState);
		}
	catch( e ) {
		alert("Ca ne marche pas")
	}
}

Tschaoo

**leoche** · 16/03/2007, 14h17

ben j'ai essayé et plus rien ne marche meme sous fireFoxe ... par contre sa marche avec ces deux lignes :

xhr.onload=tcb;
xhr.onreadystatechange =tcb;

a la place de :
xhr.onload=tcb; seul

**fross** · 16/03/2007, 17h32

Salut,
Avec tes deux lignes la fonction tcb est appellé 4 fois, car la propriété onreadystatechange possède quatres status, c'est a dire que pendant ta demande xhr la fonction tcb est appellé 4 fois et c'est seulement lors du dernier état avec valeur 4 que ton div recoit des données.

Apparemment tu sais que ca ne fonctionne pas, mais tu as pas cherché a faire un débugage pas a pas, c'est la base dans Javascript.

Tu ne pourras résoudre l'erreur si tu ne sais pas ou elle se trouve.
Utilise des alert, j'ai modifié ton code avec ceci test pour voir :

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
 
// JavaScript Document
function getHttp_Request(){
 
	var http_request = false;
 
	if (window.XMLHttpRequest) { // Mozilla, Safari,...
		http_request = new XMLHttpRequest();
		if (http_request.overrideMimeType) {
			http_request.overrideMimeType('text/html; charset=utf-8');
			// Voir la note ci-dessous à propos de cette ligne
		}
	} else if (window.ActiveXObject) { // IE
		try {
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
				http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {}
		}
	}
 
	if (!http_request) {
		alert('Abandon :( Impossible de cr&eacute;er une instance XMLHTTP');
		return false;
	}else{
		return http_request;
	}
 
}
 
 
function test() {
 
	//xhr.onload=tcb; ////la fonction de rappel qui gère la réponse du serveur
	xhr = getHttp_Request();
	if(xhr){
		xhr.onreadystatechange = function() { 
		//on affiche la barre de progression
		try {
			if (xhr.readyState == 4) {
				if (xhr.status == 200) {
					tcb(xhr.responseText);
				}else{
					alert("Une erreur est survenue sur la page PHP");
				}
			}else{
				alert("Transfert en cours : "+ xhr.readyState);
			}
		catch( e ) {
			alert("Ca ne marche pas erreur cotée JS client");
		}
	}
	//la requête est envoyé en mode asynchrone(paramètre true) pour éviter de geler le navigateur
	xhr.open("GET","test.php",true);
	xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded; charset=utf-8");
	xhr.setRequestHeader("Content-length", parameters.length);
	xhr.setRequestHeader("Connection", "close");
	xhr.send(null);
	}
 
 
}
 
function tcb(texte) {
	document.getElementById("fr").innerHTML = "ça marche !!!" + texte;
 
}
 
 
//demarrage
test();

Bonne soirée
fross

**leoche** · 05/04/2007, 15h42

Merci sa marche

**leoche** · 05/04/2007, 16h03

ah non en fait, tjs le onreadystatechange ki marche pas sous ie, je c pas d'ou sa viens je vous donne mon nouveau code (c'est une barre de progression pour un upload de fichier utilisant l'extension php APC) :

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
/*
    Temporise avant l'envoie de la requête pour éviter un bug
*/
function attendEnvoie() 
{
	setTimeout(testProgress,500);
}
 
 
 function getXhr()
{
	var http_request = false;
 
	if (window.XMLHttpRequest) { // Mozilla, Safari,...
		http_request = new XMLHttpRequest();
		if (http_request.overrideMimeType) {
			http_request.overrideMimeType('text/html; charset=utf-8');
			// Voir la note ci-dessous à propos de cette ligne
		}
	} else if (window.ActiveXObject) { // IE
		try {
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
				http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {}
		}
	}
 
	if (!http_request) 
	{
		alert('Abandon :( Impossible de cr&eacute;er une instance XMLHTTP');
		return false;
	}
	else
	{
		return http_request;
	}
}
 
/*
    Construit la requête xmlHttpRequest 
*/
function testProgress() {
 
	var nomfichier = document.getElementById("nom").value;
	var fichier = document.getElementById("test_file").value;
	var idProgress=document.getElementById("progress_key").value;
 
	if((nomfichier!="")&&(fichier!=""))
	{
	    var xhr = getXhr();
 
		 document.getElementById("enCours1").innerHTML = "Upload en cours, Veuillez patienter et ne rien faire en attendant la fin de l'upload...<br / ><br />" ;
		 document.getElementById("tab").innerHTML=" ";
		 document.getElementById("enCours").innerHTML = " ";
 
	    //xhr.onload=tcb; ////la fonction de rappel qui gère la réponse du serveur
	    //la requête est envoyé en mode asynchrone(paramètre true) pour éviter de geler le navigateur
 
 
	     //xhr.open("GET","progress.xhr.php?progress_key="+idProgress,true);
	    // xhr.send(null);
 
		if(xhr)
		{
 
			xhr.onreadystatechange = function() 
			{ 
				alert("OK3");
				//on affiche la barre de progression
				try 
				{
 
					if (xhr.readyState == 4) 
					{
						if (xhr.status == 200) 
						{
 
							tcb(xhr.responseText);					
						}
						else
						{
							alert("Une erreur est survenue sur la page PHP");
						}
					}
					else
					{
						alert("Transfert en cours : "+ xhr.readyState);
					}
 
				}
				catch( e ) 
					{
						alert("Ca ne marche pas erreur cotée JS client");
					}
				//la requête est envoyé en mode asynchrone(paramètre true) pour éviter de geler le navigateur
				xhr.open("GET","progress.xhr.php?progress_key="+idProgress,true);				
				xhr.send(null);
			}
		}
	}
	else
	{
		document.getElementById("enCours1").innerHTML = " " ;
		 document.getElementById("tab").innerHTML=" ";
		 document.getElementById("enCours").innerHTML = " Vous devez remplir tous les champs... ";
		 stop();window.stop();
	}
 
}
 
 
 
/*
    La fonction de rappel de l'objet xmlHttpRequest
*/
function tcb(texte) {
    var repXhr=texte; //récupération de la réponse du serveur via l'objet xmlHttpRequest (this)    
    /*
        La réponse envoyé par le serveur étant au format texte il faut utiliser eval() pour la manipuler
        La réponse au format json ne peut être exploité directement par eval,
        il faut l'entourer de parenthèses via une concaténation pour éviter un bug
    */
    var objRep=eval("("+repXhr+")");
    var pourcentage = parseInt((objRep.current/objRep.total)*100);
    document.getElementById("enCours").innerHTML = objRep.current + " ko sur " + objRep.total + " ko <br /><br />"+pourcentage+" % <br /><div class=\"pourctotal\"><div class=\"pourccours\" style=\"width:"+(pourcentage*4)+"px;\"></div></div>";
 
 
    //tant que l'upload est en cours le serveur est réinterrogé
    if (objRep.done==0) 
	{ 
	document.getElementById("tab").innerHTML="";	
	setTimeout(testProgress(),500);	
	}
	else
	{
		if(objRep.cancel_upload == 0)
		{
			document.getElementById("tab").innerHTML="<br /><center>L'upload a été éffectué avec succée avec un débit de "+parseInt((objRep.rate/1000))+"kb/s </center>";
		}
		else
		{
			document.getElementById("tab").innerHTML="<br /><center>L'upload a échoué";
		}		
	}
}

**Nighty** · 06/04/2007, 10h33

Ignorez mon commentaire, fin de semaine, pas réveillé...

**leoche** · 06/04/2007, 11h22

????????

**Nighty** · 06/04/2007, 12h41

J'avais simplement écrit une énormité, je m'en suis rendu compte trop tard donc j'ai édité mon message.

Simplement pour t'aider, pourrais-tu éventuellement décrire mieux ce que fait (ou ne fait pas) IE ?

J'ai vu que tu avais des alert dans ton code, lesquelles s'affichent, un message d'erreur de IE apparait-il, que dit-il ?

[AJAX] Ajax sous internet explorer 7

JavaScript

Discussions similaires

Partager

Partager