xmlHttp.responseText et innerHTML

mathlouthi · 28 Avril 2008

Bonjour,

je débarque sur une solution Ajax il ya 3 jours , en fait mon problème :

je veux afficher des résultats de recherche dans un div résultat en fonction du scrolling cad lorsque la position du scroll atteind la fin de la page une requette qui demande les 10 résultats suivant est envoyé au serveur et les résultats sont affiché à la fin du div.

techniquement : mon résultats est "xmlHttp.responseText " , ma première solution c'était :

document.getElementById("result").innerHTML +=; xmlHttp.responseText;

mais j'ai remarqué que le temps d'affichage des résultats augmente avec le nombre des requettes et la taille du div résultats , en fait lorsque il ya un nouvel résultat , tout le contenu du div résultat est reconstrui...
donc cette solution est à rejeté .

ma deuxième solution est de jouer sur les objet du dom js;
voila :
si je met :
var mydiv = document.createElement('div');
mydiv.innerHTML = xmlHttp.responseText;
document.getElementById("result").appendChild(mydiv);
le browser est bloqué

et si je met :
var mydiv = document.createElement('div');
var text = document.createTextNode(xmlHttp.responseText);
mydiv.appendChild(text) ;
document.getElementById("result").appendChild(mydiv);
le problème du temps de réponse est reglé mais le résultat est affiché sous format text cad comme :
<doctype ........> <div>hhdhhhhd</div>................................

voila si on veut résumer la problématique : dans la deuxième solution je veux une méthode ou une technique qui interprete xmlHttp.responseText sous format HTML comme elle fait la méthode .innerHTML.

Cordialement...

Lassaad MATHLOUTHI.

jcaron · 28 Avril 2008

mathlouthi a dit:
voila si on veut résumer la problématique : dans la deuxième solution je veux une méthode ou une technique qui interprete xmlHttp.responseText sous format HTML comme elle fait la méthode .innerHTML.

Sans trop réfléchir je dirais:

Code:

var mydiv=document.createElement('div');
mydiv.innerHTML=xmlHttp.responseText;
document.getElementById("result").appendChild(mydiv);

Non?

Jacques.

mathlouthi · 29 Avril 2008

c déja fait

mais c déja fait dans la 2 eme solution et le browser est bloqué ,
non mais le principe dit ca mais je sais pas pourquoi ce blocage.. j'ai l'interpréte sous le fait que l'action retourné par la requette Ajax contient la balise <html> et la balise <body> ...peut etre ..?

jcaron · 29 Avril 2008

Re: c déja fait

mathlouthi a dit:
mais c déja fait dans la 2 eme solution et le browser est bloqué ,
non mais le principe dit ca mais je sais pas pourquoi ce blocage.. j'ai l'interpréte sous le fait que l'action retourné par la requette Ajax contient la balise <html> et la balise <body> ...peut etre ..?

Ah pardon j'avais lu trop vite, je n'avais pas vu que tu avais essayé ça. Effectivement sans le <html> et le <body> et tout ça ce serait probablement mieux déjà (sinon il faudrait faire un iframe en fait), mais vu que ça marchait avec la méthode document.getElementById("result").innerHTML += xmlHttp.responseText; c'est quand même bizarre que là ça ne marche pas...

Ceci étant dit, la solution la plus propre serait probablement que ton appel Ajax ne renvoie pas du HTML mais du JSON et de créer tous les objets qui vont bien via les appels DOM correspondants...

Jacques.

mathlouthi · 29 Avril 2008

merci

Merci beaucoup pour tes réponse ,

en fait c comme déja mentionné la 2 solution est belle mais au début elle renvoie tte une page html avec la balise
<body> et <html> ce qui cré des conflit c pourquoi le browser se bloque,

j ai réglé ce truc et tout va bien..

Merci une autre fois.

Lassaad MATHLOUTHI.