Discussion :

[Invité]

Bonjour,

J'ai adapté plusieurs tutoriaux trouver sur le net pour afficher une ligne de tableau avec 2 cellules et 1 input par cellule en cliquant sur un lien.

Code js :

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
20
 var compteur = 0;
 function addLigne(idChamp) { 
var conteneur = document.getElementById(idChamp);
 var tr1 = document.createElement('tr'); 
var td1 = document.createElement('td'); 
var td2 = document.createElement('td');
 var sdad = document.createElement('input'); 
var sdaf = document.createElement('input');
 
sdad.setAttribute("type","text"); 
sdad.setAttribute("name"," sdad["+compteur+"]");
 sdaf.setAttribute("type","text"); 
sdaf.setAttribute("name"," sdaf["+compteur+"]"); 
td1.appendChild(sdad);
 td2.appendChild(sdaf);
 tr1.appendChild(td1);
 tr1.appendChild(td2);
 conteneur.appendChild(tr1); 
compteur++;
 }

Code html :

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

1
2
3
<table border="0" cellspacing="6" id="divarticle"> 
<a href="#" onClick="javascript:addLigne(' divarticle');">Ajouter un article</a>
 </table>

Je souhaiterais avec un autre lien à côté pouvoir supprimer la dernière ligne ajouté. Y'a t-il une fonction pour supprimer la dernière entrée ? Ou bien je dois lancer une recherche de l'élement pour faire un removechild ? Car j'ai testé ça et je n'y arrive pas.

Merci pour votre aide [cligne]

[SpaceFrog]

le premier post reste éditable ...

par contre je te conseille de revoir la structure de la balise table ...

c'est original une balise <a> au milieu comme ça


de plus on appende dans le tbody d'un table ...

[Invité]

La partie HTML est complètement modifiée, elle ne ressemble plus du tout à ça, c'est pour la partie JS que je poste.

Maintenant, j'active la fonction avec un bouton placé en CSS mais ça n'impacte pas le problème de suppression.

[NoSmoking]

Bonsoir,
tu peux utiliser la méthode deleteRow en passant -1 comme paramètre ce qui supprimera la dernière ligne.
Il faut également penser à tester si il y a des lignes dans la table.

Code :

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

1
2
3
4
5
6
function removeLastLine(id_table){
  var oTable = document.getElementById( id_table);
  if( oTable.rows.length > 0){
    oTable.deleteRow(-1);
  }
}

Ne pas omettre la remarque de SpaceFrog concernant l'élément sur lequel ajouter les nouvelles lignes.

(...)c'est pour la partie JS que je poste.

Il n'enpêche que souvent les problèmes viennent du code HTML mal formé, donc autant, même pour des exemples, prendre l'habitude de bien former celui ci.

[Invité]

Merci , ça fonctionne niquel !

En plus ça résout un autre problème pour moi, ça me supprimait l'en-tête de colonne mais grâce à ta ligne sur length, je fixe à 1 et plus de souci !

Je vous fais confiance pour la partie HTML mais dans ce cas précis, c'était un bout de code qui n'existait pas. Par contre, je prends bonne note des conseils

Je le passe en résolu, merci !