Déplacer un élément d'un tableau vers un autre sur clic d'un bouton

**Lorenzaccio** · 20/07/2009, 12h45

Bonjour, j'aimerais savoir s'il est possible de déplacer une ligne d'un tableau A vers un tableau B (les 2 tableaux ont les memes colonnes) lorsque l'on clic sur un bouton en face de la ligne à déplacer.

Si c'est possible, j'aimerais bien des pistes pour le code.

Merci

**emmanuel.remy** · 20/07/2009, 13h20

Salut,

C'est une piste, fonctionnelle, que je te donne:

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
  <script type="text/javascript">
 
  function deplacer (tr) {
    //on supprime le bouton de la dernière cellule
    tr.cells[3].innerHTML="&nbsp;"
    //on supprime la ligne du tableau source
    tr= tr.parentNode.removeChild(tr);
    //on ajoute la ligne précédemment supprimée dans le tableau destination
    document.getElementById("destination").appendChild(tr);
  }
  </script>
 
  </head>
  <body>
    <table border="1">
    <tbody>
     <tr>
      <td>Article 1</td>
      <td>Bleu</td>
      <td>100 €</td>
      <td><button onclick="deplacer(this.parentNode.parentNode);">Déplacer</button></td>
     </tr>
     <tr>
      <td>Article 2</td>
      <td>Rouge</td>
      <td>120 €</td>
      <td><button onclick="deplacer(this.parentNode.parentNode);">Déplacer</button></td>
     </tr>
     <tr>
      <td>Article 3</td>
      <td>Vert</td>
      <td>130 €</td>
      <td><button onclick="deplacer(this.parentNode.parentNode);">Déplacer</button></td>
     </tr>
     <tbody>
    </table>
    <hr />
    <table border="1">
     <tbody id="destination">
     <tr style="background-color:yellow">
      <td>Article</td>
      <td>Couleur</td>
      <td>Tarif</td>
      <td>&nbsp;</td>
     </tr>
     </tbody>
    </table>
  </body>
</html>

ERE

**Lorenzaccio** · 20/07/2009, 15h11

Merci beaucoup ! J'ai plus qu'à adapter pour mon cas...

**boheme260** · 26/09/2011, 18h11

Bonjour Lorenzaccio,

Je rencontre exactement le même problème que toi, je sais que le post est vieux mais si tu as toujours le code que tu as utilisé je le veux bien s'il te plait

Merci

Déplacer un élément d'un tableau vers un autre sur clic d'un bouton

JavaScript

Vue hybride

Discussions similaires

Partager

Partager