Discussion :

[Tanebisse]

Bonjour tout le monde,
J'ai un tableau xhtml avec une liste d�roulante, quand je clique sur un �l�ment de cette liste je d�clenche un �v�nement onChange() et je voudrais ajouter une ligne dans mon tableau en fonction de ce qui est s�lectionn�.
J'arrive bien � faire tout �a avec Ajax et le framework prototype, le probl�me c'est quand j� r�cup�re ma r�ponse ajax et que je fais un innerHTML (dans un tr) �a marche pas avec IE !

Voici le code de ma fonction javascript :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
 
function afficherCompatible(reponse) {
	var ligne = document.getElementById("ligneCompatible");
	ligne.innerHTML= reponse.responseText;
}

Dans mon HTML j'ai �a :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
 
<table>
  ...
  <tr id="ligneCompatible"></tr>
  ...
</table>

Dans "reponse.responseText" de ma fonction javascript j'ai du code html (g�n�r� par un template) avec les TD qui vont bien pour remplir la TR ci dessus.

Auriez-vous une solution ?

[ThomasR]

C'est un probl�me tr�s connu qui ne se produit que sur IE :

innerHTML:

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.

Ce que tu peux faire c'est d'ajouter les <td/> dans le <tr/> avec le DOM et faire un innerHtml sur les <td/>.

[SpaceFrog]

insertRow
createElemen('td') ...

bref les contournements possibles sont multiples ...

[Tanebisse]

OK, mais le probl�me c'est que j'utilise Smarty comme moteur de template et je renvoie un template relativement important, alors tout me retaper avec le DOM, c'est un peu gal�re. De plus j'utilise dans ce template des variables smarty et autres fonctions que je ne peux pas retranscrire en Javascript.

[Tanebisse]

C'est bon enfin, j'ai trouv�. En fait le framework Prototype g�re cette aspect avec la fonction "replace". Ce qui donne �a dans mon code :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
function afficherCompatible(reponse) {
	$('compatibleLigne').replace(reponse.responseText);
}