[AJAX] XMLhttpRequest successifs

Version imprimable

Bonjour,

voilà, je cherche à charger 2 div différentes à l'aide d'un XMLhttpRequest : récupération de widgets...

j'ai donc fait des jolies fonctions qui marchent très bien si je n'en appelle qu'une seule (1 fonction par widget) : voici le code du fichier JS

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
var oXMLHttpRequest;
var sourceHTMLurl_Success = '/include/ajax/getSuccessArticle.asp';
var sourceHTMLurl_Note = '/include/ajax/getSuccessArticle.asp';
var DIVtoDisplay;
var URLtoRead;
var HTMLtoDisplay;
if (window.XMLHttpRequest) {// branch for Netscape and FireFox
	oXMLHttpRequest = new XMLHttpRequest();
}
else if (window.ActiveXObject) {// branch for IE
	oXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
else {// XMLHttpRequest non supporté par le navigateur   
}
 
 
function loadNoteArticles(pNumber, pIsCA, pIsOS, pPer, pDIV){
	URLtoRead = sourceHTMLurl_Note + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS+'per='+pPer;
	DIVtoDisplay = pDIV;
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	//on libère l'objet XmlHttpRequest
	if (oXMLHttpRequest){oXMLHttpRequest.abort();}
	oXMLHttpRequest.onreadystatechange = LoadXMLDivUpdate;
	oXMLHttpRequest.open("GET", URLtoRead, true);
	oXMLHttpRequest.send(null);
}	
 
function loadSuccessArticles(pNumber, pIsCA, pIsOS, pDIV){
	URLtoRead = sourceHTMLurl_Success + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS;
	DIVtoDisplay = pDIV;
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	//on libère l'objet XmlHttpRequest
	if (oXMLHttpRequest){oXMLHttpRequest.abort();}
	oXMLHttpRequest.onreadystatechange = LoadXMLDivUpdate;
	oXMLHttpRequest.open("GET", URLtoRead, true);
	oXMLHttpRequest.send(null);
}	
 
function LoadXMLDivUpdate(){
//alert(URLtoRead);
//alert(DIVtoDisplay);
	if (oXMLHttpRequest.readyState == 4) {// only if req shows "loaded"
		if (oXMLHttpRequest.status == 200) {// only if "OK"
			doDivUpdate();
		}
	}
}
 
function doDivUpdate(){
	// au final, je récupère du HTML et pas du XML
	document.getElementById(DIVtoDisplay).innerHTML=oXMLHttpRequest.responseText;
}

quand j'appelle les 2 fonctions (loadSuccessArticles et loadNoteArticles) l'une après l'autre, rien ne se passe. alors que quand j'en appelle 1 seule, elle s'exécute bien.
j'ai essayé en nommant les objet XMLhttpRequest avec des noms différents, mais ça ne change rien.

quel wagon aurais-je loupé ?

de plus, j'aimerais faire les appels à mes fonctions en dehors du <Body onLoad="">, mais cela ne marche pas dans ce cas... une solution ?

merci de votre aide.

28/09/2007, 21h39
denisC

Citation:

Envoyé par agrotic

quand j'appelle les 2 fonctions (loadSuccessArticles et loadNoteArticles) l'une après l'autre, rien ne se passe. alors que quand j'en appelle 1 seule, elle s'exécute bien.

Qu'est ce que tu entends par l'une après l'autre? Dans le même bloc de code? Ou simplement en réponse à un premier clic, puis à un deuxième clic?
29/09/2007, 17h47
agrotic

quand je dis l'une après l'autre, je veux dire que je les appelle dans un même bloc, l'une directement à la suite de l'autre. sans intervention de l'utilisateur :

Code:

<body onLoad="loadSuccessArticles(...);loadNoteArticles(...);">
30/09/2007, 01h05
goulmak

Bonsoir.

Il n'est pas possible d'utiliser le même objet XmlHttpRequest pour deux requêtes asynchrônes. Dans ton cas il te faut un objet par fonction, ou alors fait l'appel à la deuxième méthode uniquement lorsque la première est exécutée.
30/09/2007, 16h46
agrotic

Citation:

Envoyé par goulmak

Bonsoir.

Il n'est pas possible d'utiliser le même objet XmlHttpRequest pour deux requêtes asynchrônes. Dans ton cas il te faut un objet par fonction, ou alors fait l'appel à la deuxième méthode uniquement lorsque la première est exécutée.

Bonjour Goulmak,

j'ai bien évidemment commencé par là... mais sans résultat probant : toujours 1 exécution, pas 2...

Transforme ton code ainsi :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function getXhr(){
     var oXMLHttpRequest=null;
     if (window.XMLHttpRequest) {// branch for Netscape and FireFox
	oXMLHttpRequest = new XMLHttpRequest();
     }
     else if (window.ActiveXObject) {// branch for IE
	oXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
     }
     else {// XMLHttpRequest non supporté par le navigateur   
     }
     return oXMLHttpRequest;
}
 
function loadNoteArticles(pNumber, pIsCA, pIsOS, pPer, pDIV){
     var oXMLHttpRequest = getXhr();
     ...
}
 
function loadSuccessArticles(pNumber, pIsCA, pIsOS, pDIV){
     var oXMLHttpRequest = getXhr();
     ...
}

Et si ça marche toujours pas, reposte ton code et le bug report de ton débuggeur..

Bonjour,

bon, j'ai réglé mes petits soucis grâce à votre aide !

merci !!!!!

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
90
91
 
//paramétrage
var sourceHTMLurl_Recent = '/include/ajax/getRecentArticle.asp';
var sourceHTMLurl_Success = '/include/ajax/getSuccessArticle.asp';
var sourceHTMLurl_Note = '/include/ajax/getNoteArticle.asp';
 
//création du XMLHttpRequest pour utilisation ultérieure
function getXhr(){
     var oXMLHttpRequest = null;
     if (window.XMLHttpRequest) {// branch for Netscape and FireFox
		oXMLHttpRequest = new XMLHttpRequest();
     }
     else if (window.ActiveXObject) {// branch for IE
		oXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
     }
     else {// XMLHttpRequest non supporté par le navigateur   
     }
     return oXMLHttpRequest;
}
 
function loadRecentArticles(pNumber, pIsCA, pIsOS, pDIV){
	var oReqRecent
	var URLtoRead = sourceHTMLurl_Recent + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS;
	oReqRecent = getXhr();
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	if (oReqRecent){oReqRecent.abort();}
	oReqRecent.open('GET', URLtoRead, true);
	oReqRecent.onreadystatechange = function (){
	  if (oReqRecent.readyState == 4) {
		 if(oReqRecent.status == 200)
		  document.getElementById(pDIV).innerHTML = oReqRecent.responseText;
		 else
		  dump("Error loading page\n");
	  }
	};
	oReqRecent.send(null); 
}
 
function loadSuccessArticles(pNumber, pIsCA, pIsOS, pDIV){
	var oReqSuccess
	var URLtoRead = sourceHTMLurl_Success + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS;
	oReqSuccess = getXhr();
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	if (oReqSuccess){oReqSuccess.abort();}
	oReqSuccess.open('GET', URLtoRead, true);
	oReqSuccess.onreadystatechange = function (){
	  if (oReqSuccess.readyState == 4) {
		 if(oReqSuccess.status == 200)
		  document.getElementById(pDIV).innerHTML = oReqSuccess.responseText;
		 else
		  dump("Error loading page\n");
	  }
	};
	oReqSuccess.send(null); 
}
 
function loadNoteArticles(pNumber, pIsCA, pIsOS, pPer, pDIV){
	var oReqNote
	var URLtoRead = sourceHTMLurl_Note + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS+'&per='+pPer;
	oReqNote = getXhr();
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	if (oReqNote){oReqNote.abort();}
	oReqNote.open('GET', URLtoRead, true);
	oReqNote.onreadystatechange = function (){
	  if (oReqNote.readyState == 4) {
		 if(oReqNote.status == 200)
		  document.getElementById(pDIV).innerHTML = oReqNote.responseText;
		 else
		  dump("Error loading page\n");
	  }
	};
	oReqNote.send(null); 
}	
 
function loadNotePrivateArticles(pNumber, pIsCA, pIsOS, pPer, pDIV){
	var oReqNotePrivate
	var URLtoRead = sourceHTMLurl_Note + '?number='+pNumber+'&isCA='+pIsCA+'&isOS='+pIsOS+'&per='+pPer;
	oReqNotePrivate = getXhr();
	try {netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");}catch (e) {}
	if (oReqNotePrivate){oReqNotePrivate.abort();}
	oReqNotePrivate.open('GET', URLtoRead, true);
	oReqNotePrivate.onreadystatechange = function (){
	  if (oReqNotePrivate.readyState == 4) {
		 if(oReqNotePrivate.status == 200)
		  document.getElementById(pDIV).innerHTML = oReqNotePrivate.responseText;
		 else
		  dump("Error loading page\n");
	  }
	};
	oReqNotePrivate.send(null); 
}

Bonjour,

Un petit up du topic, environ deux ans après :ccool:

Voilà je rencontre le même problème que Agrotic. Malheureusement en ayant essayé les propositions faites dans ce topic, je n'arrive toujours pas à faire fonctionner mon site.

Dans mon code javascript, j'ai:

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
 
    function getXhr(){
		var xhr = null;
		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;
		}
		return xhr;
	}
 
    function f1(regul, cd_annee_mois, intervenant, id_in, id_out){
		var xhr_regul1;
 
        xhr_regul1 = getXhr();
		// On défini ce qu'on va faire quand on aura la réponse
		xhr_regul1.onreadystatechange = function(){
			// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
			if(xhr_regul1.readyState == 4 && xhr_regul1.status == 200){
				leselect = xhr_regul1.responseText;
				// On se sert de innerHTML pour rajouter les options a la liste
				document.getElementById(id_out).innerHTML = leselect;
			}
		}
 
		// Ici on va voir comment faire du post
//		xhr.open('POST','ajaxInterv.php',true);
 
        xhr_regul1.open('POST','ajaxInterv.php',true);
 
		// ne pas oublier ça pour le post
		xhr_regul1.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		// ne pas oublier de poster les arguments
		// ici, l'id de l'agence de l'intervenant
		sel = document.getElementById(id_in);
		idAgence = sel.options[sel.selectedIndex].value;
		xhr_regul1.send('idAgence='+idAgence+'&cd_annee_mois='+cd_annee_mois+'&intervenant='+intervenant+'&regul='+regul);
	}
 
    function f2(regul, cd_annee_mois, intervenant, id_in, id_out){
 
		var xhr_regul2;
 
        xhr_regul2 = getXhr();
 
		// On défini ce qu'on va faire quand on aura la réponse
		xhr_regul2.onreadystatechange = function(){
			// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
			if(xhr_regul2.readyState == 4 && xhr_regul2.status == 200){
				leselect = xhr_regul2.responseText;
				// On se sert de innerHTML pour rajouter les options a la liste
				document.getElementById(id_out).innerHTML = leselect;
			}
		}
 
		// Ici on va voir comment faire du post
//		xhr.open('POST','ajaxInterv.php',true);
 
        xhr_regul2.open('POST','ajaxInterv.php',true);
 
		// ne pas oublier ça pour le post
		xhr_regul2.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		// ne pas oublier de poster les arguments
		// ici, l'id de l'agence de l'intervenant
		sel = document.getElementById(id_in);
		idAgence = sel.options[sel.selectedIndex].value;
		xhr_regul2.send('idAgence='+idAgence+'&cd_annee_mois='+cd_annee_mois+'&intervenant='+intervenant+'&regul='+regul);
	}

Et donc quand je n'appelle qu'une fonction à la fois (f1 ou f2), j'obtiens le résultat souhaité. Mais lorsque j'appelle les deux fonctions dans le même bloc (f1 puis f2), rien ne se passe.

Pour l'appel des fonctions f1 et f2 je fais tout simplement:

Code:

1
2
3
4
5
6
7
8
9
10
 
<script type='text/javascript'>
				f1("regul1",<?php echo $cd_annee_mois;?>,"<?php echo $lib_interv;?>","combo_ag_interv_regul1","combo_intervenant_regul1");
			</script>
 
un peu plus loin dans le code, je fais:
 
<script type='text/javascript'>
                f2("regul2",<?php echo $cd_annee_mois;?>,"<?php echo $lib_interv;?>","combo_ag_interv_regul2", "combo_intervenant_regul2");
			</script>

Peut-être que j'ai loupé un élément important dans les explications des posteurs du topic...
Pouvez-vous me dire ce qui ne va pas?

Merci d'avance.