Modif innerHTML d'un div entre 2 XMLHttpRequest synchrones sous IE [Résolu]

Signaler
Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
-
Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
-
Bonjour,

Je suis en train de concevoir un outil qui, au clic sur un bouton, parcours les lignes d'un tableau, chaque ligne contenant 3 colonnes (pour simplifier) : une valeur "maREf" et deux cases à cocher.
Pour chaque ligne et pour chaque case cochée, je passe maRef en paramètre à une cgi en VB6 (il y en a donc deux différentes) à l'aide de XMLHttpRequest synchrone. Je remplace, au final, la case cochée par le résultat true ou false du responseText de ma requête.

function getXhr(){
var xhr=null;
if(window.XMLHttpRequest)
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e1){
xhr = null;
}
}
}
else {
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
}
return xhr;
}

function lance(){
var montbl = document.getElementById("idtabclt");
var montblbody = montbl.getElementsByTagName("tbody")[0];

for (var i=0; i < montblbody.rows.length; i++){
var refcpt = montblbody.rows[i].cells[1].innerHTML
if (montblbody.rows[i].cells[6].getElementsByTagName('input')[0].checked){
document.getElementById("ge" + refcpt).innerHTML = "";
envoi_cg1("cgi/clo/cgi_retsouf_clo.exe?act=clo&cpt=" + refcpt + "&typ=ge" + "&uid=" + Math.random(), "ge" + refcpt);
}
if(montblbody.rows[i].cells[7].getElementsByTagName('input')[0].checked){
document.getElementById("av" + refcpt).innerHTML = "";
envoi_cg1("cgi/clo/cgi_retsouf_clo.exe?act=clo&cpt=" + refcpt + "&typ=av" + "&uid=" + Math.random(), "av" + refcpt);
}
}
}

function envoi_cg1(url, monid){
var xhr1 = getXhr()	
document.getElementById(monid).innerHTML = "";
xhr1.open("GET", url, false);
xhr1.send(null);
if(xhr1.status == 200){			
if (xhr1.responseText.toLowerCase() == "true"){
document.getElementById(monid).innerHTML = "";
}
else {
document.getElementById(monid).innerHTML = "";
}		
}
}

function envoi_cgi2(url, monid){
var xhr2 = getXhr()	
document.getElementById(monid).innerHTML = "";
xhr2.open("GET", url, false);
xhr2.send(null);
if(xhr2.status == 200){			
if (xhr2.responseText.toLowerCase() == "true"){
document.getElementById(monid).innerHTML = "";
}
else {
document.getElementById(monid).innerHTML = "";
}
}	
}


J'observe, quand je lance le bidule sous FF6, que tout fonctionne. Quand je dis que ça fonctionne, c'est que chaque requête synchrone renvoi un résultat et que ma case à cocher est bien remplacée. On peut donc suivre la progression de l'ensemble. Je suis plutôt content de moi sauf que sous IE6 et IE8 (sur IE en général donc ?) ça freeze dès le début. Ca freeze tellement que même le bouton n'est pas relaché ! Donc pas le côté progression que j'aime tant.

Je sais, je ne suis pas raisonnable. IE6, VB6 et Jean Paul 6 c'est du passé. C'est pourtant une réalité en 2011 dans ma boîte (avec windows 2000, arg).

Merci aux généreux bienfaiteurs.

Pac

6 réponses

Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
2
Bonjour à tous,

Je reviens sur la question après quelque temps. Comme l'a dit Zobibol, ma gestion du onreadystatechange n'était pas terrible. J'ai enfin trouvé la réponse à l'aide de la technique du CALLBACK !

Pac
Messages postés
159
Date d'inscription
mardi 2 janvier 2007
Statut
Membre
Dernière intervention
7 mai 2012

Salut,

Je ne sais plus dans quel cas innerHtml ne fonctionne pas sous IE, mais je pense que le problème vient de là.

Essaie l'équivalent jquery
$("#id").html(var)


Tu peux télécharger la librairie jquery ici

Je te concède qu'ajouter cette librairie augmentera le poids de ta page, mais en tout cas en premier lieu ça te permettra de voir si le problème vient de là.

Cordialement
Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
2
Je pense qu'innerHTML fonctionne puisqu'à la fin du traitement, j'obtiens pareil que sous Firefox : mes cases à cocher ont été remplacées. Cela dit me mettre à jquery serait peut-être une bonne chose.


Pac
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Statut
Membre
Dernière intervention
20 février 2017
4
bien le bonjour, il n'est pas évident de tester comme ça, mais il semblerait que ce soit d'un point de vue gestion de la requête qu'il y ait une erreur:

j'aurais plus aborder le problème comme ceci:
function getXhr(){
var xhr=null;
if(window.XMLHttpRequest)
xhr = new XMLHttpRequest();
else if(window.ActiveXObject){
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e1){
xhr = null;
}
}
}
else {
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
}
return xhr;
}

function lance(){
var montbl = document.getElementById("idtabclt");
var montblbody = montbl.getElementsByTagName("tbody")[0];

for (var i=0; i < montblbody.rows.length; i++){
var refcpt = montblbody.rows[i].cells[1].innerHTML
if (montblbody.rows[i].cells[6].getElementsByTagName('input')[0].checked){
document.getElementById("ge" + refcpt).innerHTML = "";
envoi_cg1("cgi/clo/cgi_retsouf_clo.exe?act=clo&cpt=" + refcpt + "&typ=ge" + "&uid=" + Math.random(), "ge" + refcpt);
}
if(montblbody.rows[i].cells[7].getElementsByTagName('input')[0].checked){
document.getElementById("av" + refcpt).innerHTML = "";
envoi_cg1("cgi/clo/cgi_retsouf_clo.exe?act=clo&cpt=" + refcpt + "&typ=av" + "&uid=" + Math.random(), "av" + refcpt);
}
}
}

function envoi_cg1(url, monid){
var xhr1 = getXhr()	
document.getElementById(monid).innerHTML = "";
xhr1.open("GET", url, false);
xhr1.send(null);
xhr1.onreadystatechange= function (ev){
// tout d'abord on ne s'intérresse qu'à la réponse ok.
if (xhr1.readyState == 4){
if(xhr1.status == 200){			
if (xhr1.responseText.toLowerCase() == "true"){
document.getElementById(monid).innerHTML = "";
}
else {
document.getElementById(monid).innerHTML = "";
}
}
}		
}
}

function envoi_cgi2(url, monid){
var xhr2 = getXhr()	
document.getElementById(monid).innerHTML = "";
xhr2.open("GET", url, false);
xhr2.send(null);

xhr2.onreadystatechange= function (ev){
// tout d'abord on ne s'intérresse qu'à la réponse ok.
if (xhr2.readyState == 4){
if(xhr2.status == 200){			
if (xhr2.responseText.toLowerCase() == "true"){
document.getElementById(monid).innerHTML = "";
}
else {
document.getElementById(monid).innerHTML = "";
}
}
}		
}
}


l'utilisation de onreadystatechange change probablement la donne. Et est plus en conformité (je pense avec IE... pas tester donc... pas certain que cela résolve le problème, en outre, c'est le traitement qu'il faut faire.).

[o-_-o]
Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
2
Salut Zobibol,

Merci pour ta réponse, hélas le script ne passe même plus dans le bloc onreadystatechange, ni avec FF6 ni avec IE.


Pac
Messages postés
113
Date d'inscription
lundi 31 mars 2003
Statut
Membre
Dernière intervention
19 décembre 2011
2
Mais readyState == 4 et status == 200 quand la requête synchrone est terminée

Pac