Suppression de lignes rajoutées (DOM)
Bonjour,
Tout d'abord désolé si je ne suis pas dans le bon sujet.
Ensuite, J'ai un tableau par défaut avec 3 lignes. J'ai créé un bouton qui en créé 2 (car la derniere cellule est fusionnée).
Tout marche bien, sauf quand j'essaye d'en supprimer, je galère je n'y arrive pas.
Voici mon code HTML du tableau :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| <table id="MyTAB">
<tr>
<td>Code Produit</td>
<td>Désignation</td>
<td>Facturable</td>
</tr>
<tr style="background-color:#ddd;">
<td> </td>
<td> </td>
<td rowspan="2"</td>
</tr>
<tr >
<td></td>
<td> </td>
</tr>
</table> |
Mon bouton pour rajouter mes 2 lignes :
Code:
<input type="button" onclick="javascript:AddRow('MyTAB','0');" value="+" style="font-size:28px;font-weight:bolder;font-family:verdana;" title="Rajouter une ligne" />
Et voici maintenant mon code pour rajouter 2 lignes à chaque clic sur le bouton :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
| function AddRow( tableau, Indice )
{
Indice++;
var Ligne = 1;
var NbLigneMax = 2
tableau = document.getElementById(tableau);
var tds = tableau.getElementsByTagName('tr')[0].getElementsByTagName('td').length;
do
{
var tr = document.createElement('tr');
if( Ligne == 1 ) tr.style.backgroundColor = "#dddddd";
for(var i = 1; i<= tds; i++)
{
if( Ligne == 1 && i == tds )
{
var td = document.createElement('td');
td.rowSpan = "2";
tr.appendChild(td);
}
else if( Ligne == 2 && i == tds )
{
// Si c'est la derniere cellule de la derniere ligne rajoutée on ne la déclare pas car elle a été fusionnée avec la derniere celulle de la premiere ligne
}
else
{
var td = document.createElement('td');
tr.appendChild(td);
}
}
if(tableau.firstChild.tagName == 'tbody') tableau.firstChild.appendChild(tr);
else tableau.appendChild(tr);
Ligne++;
}
while( Ligne <= NbLigneMax )
} |
Je voudrais supprimer donc ces 2 dernieres lignes ajoutées, mais pas celles déjà contenues dans le HTML, uniquement celles que j'ai générées.
J'ai testé ceci :
Code:
1 2 3 4 5 6 7 8 9 10 11
| function DelRow( tableau, NbLignes ) // Renseigner l'ID du tableau
{
var Indice = 0;
var tr = document.getElementsByTagName('tr');
do
{
document.getElementById( tableau ).deleteRow( -1 ); // On supprime la derniere ligne du tableau : parametre -1 de la fonction deleteRow()
Indice+= 1;
}
while( Indice < 2); // On boucle 2 fois
} |
Mais ça me fait exactement l'inverse de ce que je souhaite : ça supprime les lignes que je n'ai pas rajoutés grace à ma fonction JS :(
Quelqu'un peut m'aider svp ?
Merci
Ju'