Discussion :

[renaud26]

Bonjour à tous,

J'ai crée un httpRequest pour afficher un bloc HTML qui contient des variables PHP. Ce bloc HTML est un morceau de tableau dans le genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<?php
for($i = 0; $i<count($data);$i++){
echo "<tr><td>".$data[$i]."</td></tr>";
}
?>

Dans la page où il doit s'afficher, j'ai crée :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<table>
<tr><td>titre</td></tr>
<tbody id="donnees"></tbody>
</table>

Le fichier JS contient l'instruction suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
xhr.onreadystatechange = function() { 
if(xhr.readyState == 4) {
document.getElementById('donnees').innerHTML =   xhr.responseText;
 }
return xhr.readyState;
}

Sur Firefox, pas de souci, c'est nickel.
Sur IE : "Erreur d'exécution inconnue" et rien ne s'affiche.
Par contre, si au lieu de <tbody id="donnees"></tbody>, je mets <div id="donnees"></div> il n'y a plus d'erreur et le bloc s'affiche....n'importe où dans la page et pas à l'endroit souhaité.

Quelqu'un a t-il une soluce pour contourner ce problème ?
D'avance, je l'en remercie.

[andry.aime]

Bonjour,

<table>
<tr><td>titre</td></tr>
<tbody id="donnees"></tbody>
</table>

Essaies d'utiliser un thead et th pour l'en-tête.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<table>
<thead><th>titre</th></tr></thead>
<tbody id="donnees"></tbody>
</table>

[SpaceFrog]

ce n'est pas l'ajax qui pose problème, mais l'inserton sur le retour du code html dans la page ...
Montre nous plutot cette partie là ...

[renaud26]

Bonjour et merci pour ta réponse,

Malheureusement, un <thead> ne change rien.
En réalité, je n'ai mis ce bout de code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<table>
<tr><td>titre</td></tr>
<tbody id="donnees"></tbody>
</table>

que pour l'exemple et pour simplifier un max tout en montrant que ça se passe dans un tableau HTML.

En réalité, cette table contient beaucoup d'autres données, genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<table>
<tr>
<td>Titre</td>
</tr>
<tbody>
<tr>
<td>Des données</td>
</tr>
</tbody>
etc....
<tbody id="donnees"></tbody> ----->ici affichage souhaité httpRequest
etc...encore des données
</table>

Je ne parviens pas à comprendre pourquoi le httpRequest s'affiche dans un <div> et pas dans un <tbody>. J'ai fait un document.write des données httpRequest et vérifié le code HTML qui doit s'afficher dans le <tbody> : il est correct.

[renaud26]

Bonjour SpaceFrog, nos posts se sont croisés.

Voici le code qui doit s'afficher dans le <tbody> :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<tr>
<td class="mainTdO"  style="background-color:#99FF00;color:#000000">
<b>Choisissez le produit N° 1
<br><br>
Code promo du produit N° 1 : </b>
</td>
<td class="mainTdO" style="background-color:#99FF00;color:#000000">
<select name="prod[0]" id="selectProd" onchange=""  >
<option value=""><---Sélectionnez un produit---></option>
<option value="1">N° 1 - produit 1</option>
<option value="6">N° 6 - produit 2</option>
<option value="8">N° 8 - produit 3</option>
</select>
<br><br>
<select name="the_code_promo[]"  >
<option value="0">Aucun code promo</option>
</select> 
</td></tr>

Je ne vois rien de particulier là-dedans, d'autant que FF l'affiche très bien et où il faut. Le code qui est au dessus et au dessous du <tbody> me semble sain, mais je vais quand même faire des vérifs de ce côté là...

[SpaceFrog]

je ne vois pas le code js qui fait l'insertion ...

[SpaceFrog]

désolé au temp s pour moi ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('donnees').innerHTML =   xhr.responseText;

il semblerait que IE ait un peu de mal avec l'insertion de code html dans les tableaux ...
d'une part il faut insérer dans le tbody (ou le thead)
essaye

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
document.getElementById('donnees').parentNode.tbody.innerHTML =   xhr.responseText;

Mais je doute que tu aies de meilleurs resultats
pour moi il sera plus sur de recupérer les infos necessaires à la creation d'objets coté js soit avec createElement soit insertCell et rows ...

[renaud26]

Alors, pour tenter de cerner le problème, j'ai isolé le code de la page qui insère le JS et l'ai réduit à sa simple expression :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
<SCRIPT LANGUAGE="Javascript" SRC="js/fonctions_xhr.js"></script>
</head>
<body onload="charge_produits('1','std','mono-produit','test','0','0','ship','3');">
<form id="params" name="params">
<table>
<tbody id="donnees"></tbody>
</form>
</table>

Nickel sur FF - Warning avec IE.

[SpaceFrog]

il semblerait que IE ait un peu de mal avec l'insertion de code html dans les tableaux ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<SCRIPT LANGUAGE="Javascript" SRC="js/fonctions_xhr.js"></script>
</head>
<body onload="charge_produits('1','std','mono-produit','test','0','0','ship','3');">
<form id="params" name="params">
 
<pre id="donnees"></pre>
</form>
</table>

Je parie que ça fonctionne sous IE ...

[renaud26]

Merci pour tes conseils.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
document.getElementById('donnees').parentNode.tbody.innerHTML = xhr.responseText;

Ne fonctionne ni avec IE ni avec FF (parentNode.tbody is undefined)

Par contre <pre id="donnees"></pre> fonctionne sous IE, de même que <div> ou <span>... mais bonjour l'affichage ! Bien évidemment ça sort complètement du tableau d'affichage.

C'est ce satané <tbody> qui pose problème.

Mais une précision tout de même : bien que FF affiche le test correctement, j'ai quand même un gros warning dans la console erreur :

Erreur*: balise ne correspondant pas. Attendu*: </br>.
Ligne*: 1, Colonne*: 141
Code Source*:
<tr><td class="mainTdO" style="background-color:#99FF00;color:#000000"><b>Choisissez le produit N° 1<br><br>Code promo du produit N° 1 : </b></td>

C'est ouf : il me demande un </br> avant le dernier </b> !!!

[SpaceFrog]

non c'est juste 'insertion de code html dans une balise table qui pose souci là ...


http://www.developpez.net/forums/d91...ement-sous-ie/