Page 1 sur 1
Ajouter une ligne dans un tableau
Posté : 17 juin 2007, 15:20
par kmeleon
Salut à tous !
J'arrive pô à trouver comment insérer un simple
dans un <div id="salut"></div>, dynamiquement avec un javascript...
La méthode du
Code : Tout sélectionner
document.getElementById("salut" ).innerHTML += "<tr><td>Test</td></tr>";
ne semble pas marcher... En fait ça m'affiche le texte "Test" avant le tableau (et ma balise <div> est aussi déplacée
), et le <tr><td></td></tr> ne s'affiche tout simplement pas...
Je suis perdu
Help me
Bonne journée
Posté : 17 juin 2007, 16:15
par Sékiltoyai
Il faut peut être aussi mettre la balise <table> pour construire ton tableau...
Posté : 18 juin 2007, 18:29
par kmeleon
J'adore ^^ Merci de ne pas me prendre pour un abruti complet, les balises <table></table> sont bien sûr présentes...
Le <div> est disposé comme ça:
Et il faut que j'y insère
. . .
Posté : 18 juin 2007, 19:02
par Cyrano
On va commencer par un point important : le code avec un div en dehors d'un <td> n'est pas un code HTML conforme, il est encore moins valide bien entendu.
D'autre part, où est donc l'élément donc l'attribut
id est "
salut"
Posté : 18 juin 2007, 19:42
par kmeleon
C'est le
div en question.
On m'a orienté sur ceci:
avec
Code : Tout sélectionner
var tableau = document.getElementById("monTableau" );
var ligne = document.createElement("tr" );
var cellule = document.createElement("td" );
var texte = document.createTextNode("Du texte" );
cellule.appendChild(texte);
ligne.appendChild(cellule);
ligne.appendChild(cellule);
tableau.appendChild(ligne);
Ca marche, mais la ligne et la cellule sont ajoutées à la fin du tableau (alors que je voudrais les mettres entre deux lignes), et j'aimerai pouvoir attribuer un
class sur mon
<td>...
Comment faire ?
Posté : 18 juin 2007, 19:48
par Cyrano
Alors utilise un <tbody> pour encadrer les lignes au bout desquelles vont se rajouter les lignes dynamiques et mets-y un attribut id pour pointer dessus. Même si d'autres lignes suivent le <tbody>, les nouvelles lignes resteront à l'intérieur.
Note : dans un tableau HTML, on ne peut avoir qu'un seul et unique <thead> et un seul <tfoot>, mais on peut avoir plusieurs <tbody> ce qui dans ce cas précis est particulièrement pratique. Mais attention, pas de <tbody></tbody> vide : donc tu peux y avoir au départ la première ligne contenant par exemple le titres des colonnes.
Posté : 18 juin 2007, 21:09
par kmeleon
En laissant le <tbody></tbody> vide, y'a pas de problème (en tout cas au niveau de l'affichage, je verrai avec le w3c après), néanmoins mon problème de
class sur le
td n'est pas résolu...
Il faudrait par exemple:
Posté : 18 juin 2007, 22:49
par Cyrano
Utilise la méthode setAttribute('class', 'mon_style'). Avec IE, il faut, sauf erreur de ma part utiliser une autre méthode en mettant (de mémoire) quelque chose comme :
var cell = createElement('td');
cell.className = 'mon_style';
Tu trouveras de la
documentation sur SelfHTML sur le sujet