AJAX et javascript problème innerHTML IE7

Bonjour à tous et toutes.

c'est mon premier sujet et ça m'embete de poster une question comme premier sujet mais là j'ai vraiment du mal et je ne vois pas d'où ça peut venir.

Je vous esplique donc mon problème et son environnement.
Je travaille dans une entreprise qui utilise en majorité IE7, la migration vers Firefox n'est pas envisageable.
Je travail sur l'application web "APEX HTML-DB" pour base de données Oracle. Je le précise car il est probable que cette application m'insère des bug que je n'aurais pas eu en temps normal.

Je désire utilisé du javascript et en particulier de l'AJAX sur l'une de mes pages.
Pour cela j'utilise un script que j'ai trouvé sur le premier site qui parle d'AJAX sur google:

    var xhr; 
    try {  xhr = new ActiveXObject('Msxml2.XMLHTTP');   }
    catch (e) 
    {
        try {   xhr = new ActiveXObject('Microsoft.XMLHTTP');    }
        catch (e2) 
        {
          try {  xhr = new XMLHttpRequest();     }
          catch (e3) {  xhr = false;   }
        }
     }
 
    xhr.onreadystatechange  = function()
    { 
         if(xhr.readyState  == 4)
         {
              if(xhr.status  == 200)
                 document.getElementById(id).innerHTML =' '+xhr.responseText; 
              else 
                 document.ajax.dyn="Error code " + xhr.status;
         }
    }; 

   xhr.open( "POST", url,  true); 
   xhr.send(null); 

Cependant, malgré que cela fonctionne de partout sur d'autre site, ça ne fonctionne pas sur APEX avec IE7 !
Après plusieurs essais il apparait que c'est la ligne

document.getElementById(id).innerHTML =' '+xhr.responseText; 

qui ne fonctionne pas.

Quelques éléments de réponse m'on déjà été fourni:
-Il ne faut pas que l'élément inséré soit nul. (c'est pour cela que j'ai ajouté l'espace avant le xhr.responseText.
-lorsque l'on utilise getElementById sur IE7, il prend le premier élément qui a pour nom ou id la valeur donnée. j'ai donc changé la valeur de mon id pour lui mettre une valeur unique.

Tout cela ne fonctionne pas sur IE. avec Firefox tout fonctionne correctement.

Mis à part la fonction ci-dessus j'ai plusieurs fois le même bug dùe à innerHTML.

D'un autre coté j'ai aussi cette fonction qui fonctionne très bien

function changeTitle(texte){
	var wwvflow;
	var newwwvflow;
	wwvflow = document.getElementById("titre_a_changer").innerHTML;
	newwwvflow = wwvflow.replace(/titre/,"titre" + texte);
	wwvflow = newwwvflow;
	[#red]document.getElementById("titre_a_changer").innerHTML = wwvflow;[#]
}

Il y a bien un innerHTML donc je ne comprend pas.

========================================

La seule chose qui pourrait peut-être etre la cause de cela independament d'une érreur de syntaxe javascript, est le lieu ou j'utilise mes fonctions.
les fonctions qui marche sont dans le header de ma page alors que les autres sont dans des sous-parties "body" (bien que le javascript soit tout le temps dans le header).

========================================

ça fait beaucoup de texte et c'est certainement très mal expliqué vu que je ne comprend pas moi même d'où ça vient.
Je vous demande donc d'être indulgent.

Je vous remercie d'avance pour vos réponses en esperant recevoir un minimum d'aide.

Je ne saurai pas t'apporter la réponse, ayant moi même ce problème
Dans ce topic ICI que la raison serait le "charset" mais je ne sais pas comment régler le problème pour autant

Si quelqu'un a une solution ca serait sympa

Hello,

J'imagine que le premier bout de code que tu indique est un extrait d'une fonction qui prends 'id' comme parametre ?
Non, je demande parce que tu fais un document.getElementById(id) dedans alors que id n'est pas défini.

Essaie de remplacer rajouter un alert(document.getElementById(id)) avant l'ajout du innerHTML (rajoute bien des { } à ta conditions maintenant qu'on y mets deux instructions).

Sinon il est aussi possible que l'endroit où ton script est placé dans la page puisse jouer. Il faut que l'élément HTML que tu cible soit présent dans le code HTML avant que tu ne fasse appel à ta fonction, sinon il ne le trouvera pas.

Par exemple

<div id="monId">Blabla</div>
function foo(id) { alert(document.getElementById(id).innerHTML); }
foo("monId");

Affichera bien Blabla alors que

function foo(id) { alert(document.getElementById(id).innerHTML); }
foo("monId");
<div id="monId">Blabla</div>

N'affichera rien du tout.

C'est bel et bien le moment où la fonction est executée et non pas le moment où elle est définie qui est important.
Par exemple

function foo(id) { alert(document.getElementById(id).innerHTML); }
<div id="monId">Blabla</div>
foo("monId");

marchera tout aussi bien
Modifié par Tymlis (23 Aug 2008 - 03:53)

Le problème vient de la commande

document.getElementById(id).innerHTML = xhr_object.responseText;

avec internet explorer. En effet en faisant

alert(xhr_object.responseText);

le message s'affiche bien.
Mais ie bloque la fonction innerHTML avec xhr_object.responseText dans certains cas il semblerai.

Je viens de trouver une solution qui a l'air de marcher.

Prenons le cas ou id = "shoutbox".
Au lieu de faire

document.getElementById("shoutbox").innerHTML = xhr_object.responseText;

Il faut faire

var Box = document.getElementById("shoutbox");
    while (Box.firstChild) {
      Box.removeChild(Box.firstChild);
    }
	  var Ndiv = document.createElement("msgbox");
    Ndiv.innerHTML = xhr_object.responseText;
    Box.appendChild(Ndiv);

Cela à l'air de bien fonctionner chez moi