[Tableaux] Ajout dynamique de lignes à un tableau

Version imprimable

22/06/2006, 16h17
loreleï85

[Tableaux] Ajout dynamique de lignes à un tableau

Bonjour,

J'ai un formulaire d'insertion qui comporte un tableau de base qui possède 2 colonnes et 2 lignes avec 2 champs de textes à remplir.

Je voudrai que à chaque fois que l'utilisateur clique sur le bouton "+", une ligne avec 2 champs de texte se rajoute à la fin du tableau.

J'ai essayé plusieurs trucs mais rien ne fonctionne...
Comment est-ce que je dois m'y prendre?
22/06/2006, 16h19
Swoög

En PHP c'est impossible (PHP côté serveur)

en JavaScript en revanche, regarde du côté d'appendChlid ou de innerHTML...
22/06/2006, 16h20
stunti

sinon tu poste un formulaire et tu recharge la page a chaque fois.
Mais cela ne donne pas un resultat tres ergonomique.
22/06/2006, 16h23
loreleï85

Merci pour vos réponses.
je vais essayer de le faire en javascript. Mais je connais pas grandchose!

c'est tout a fait possible en rechargeant la page a chaque fois. De nombreux ecrans de ce genre existent deja (je pense par exemple aux ecrans de configuration de certains routeurs)

Pour faire cela tes champs doivent avoir des name html du genre "nom[]" pour pouvoir etre récupérés sous forme de tableau (ou nom[indice] pour etre plus propre)
Code:

1 2 3 4 5 6 7 8 9 10 11 if (isset($_POST['action']) && ($_POST['action']=='Add')) { $_POST['liste']['champ1'][]=''; // on ajoute une nouvelle ligne $_POST['liste']['champ2'][]=''; // de 2 champs } // on affiche les champs foreach ($_POST['liste']['champ1'] as $k=>$v) { echo "<input type='text' name=\"liste['champ1']['$k']\" value='$v'>"; echo "<input type='text' name=\"liste['champ2']['$k']\" value='".$_POST['liste']['champ2'][$k]."'>"; } // le bouton qui permet d'ajouter echo "<input type='submit' name='action' value='Add'>";
Ce n'est qu'un exemple, non testé et pas tres joli, mais bon, ca peut te donner une idée ;o)

22/06/2006, 16h41
drommk

Dom HTML -> Objet TableSection : insertRow

insertRow
Définition

La méthode javascript insertRow(index) de l'objet TableSection du Document Object Model HTML (DOM HTML) permet de d'insérer une ligne (tr) dans d'une balise HTML ou XHTML THEAD, TFOOT, et TBODY.
22/06/2006, 17h14
loreleï85

Je suis en train d'essayer de faire avec insertrow en javascript.

Je vais poster sur le forum javascript car j'ai des petits soucis avec la syntaxe...

Merci pour vos réponses!