déclaration de nouvelle variable à l'ajout d'une ligne

Version imprimable

Bonjour,

Me voici face à un problème épineux, que j'essaye de résoudre sans succès depuis la semaine dernière :
J'ai un formulaire tout simple (tableau comprenant quelques lignes), avec un bouton. Lorsqu'un utilisateur clique sur ce bouton, une ligne comprenant des <select> et des textarea apparait dans ce tableau. Cependant, je ne peux récupérer que les valeurs entrées dans la dernière ligne, puisque chaque ligne possède les mêmes noms pour chaque balise.
Je voudrais savoir comment, à chaque nouveau clic sur le bouton, je peux créer une ligne avec des noms de balise différents.
Pour mieux comprendre, voici le code :
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 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <script type="text/javascript"> function AddRow(){ var newRow = document.getElementById('table').insertRow(1); var newCell = newRow.insertCell(0); newCell.innerHTML = '<select name="operation"> <option value=1> Création </option> <option value=2> Suppression </option>'; newCell = newRow.insertCell(1); newCell.innerHTML = '<select name="matiere"> <option value=1> PE </option> <option value=2> Acier </option> <option value=3> Fonte grise </option> <option value=4> Fonte ductile </option> <option value=5> Plomb </option>'; newCell = newRow.insertCell(2); newCell.innerHTML = '<select name="pression"> <option value=1> MPB </option> <option value=2> BP </option> <option value=3> MPC </option>'; newCell = newRow.insertCell(3); newCell.innerHTML = '<input type="text" name="calibre" size="3" maxlength="3">'; newCell = newRow.insertCell(4); newCell.innerHTML = '<input type="text" name="annee" size="4" maxlength="4">'; newCell = newRow.insertCell(5); newCell.innerHTML = '<input type="text" name="longueur">'; newCell = newRow.insertCell(6); newCell.innerHTML = '<select name="nature"> <option value=1> Gaz naturel </option> <option value=2> Air </option> <option value=3> Propane </option>'; } </script> <body bgcolor="#FFFFFF" text="#000000"> <table id="table"> <tr> <td> Opération </td> <td> Matière </td> <td> Pression </td> <td> Calibre </td> <td> Année </td> <td> Longueur GDO </td> <td> Nature </td> </tr> <tr> <td><input type="button" value="Ajouter une ligne" onClick="AddRow()" ></td> </tr> </table> </body> </html>
Si c'est pas possible, dites le moi, j'essayerai de me débrouiller autrement...:?

14/08/2006, 18h37
FremyCompany
on ne doit pas écrire
Code:

1 2 "avant passage à la ligne après p.à.l"
mais bien

Code:

"av.p.à.l\nap.p.à.l"

[EDIT]Oublié les guillemets de fermeture ;)[/EDIT]
04/06/2007, 22h04
batotoba

Salut,

J'ai exactement le même problème et je n'ai pas très bien compris ta réponse
FremyCompany. Il ne manque pas un bout de code...?
Merci pour votre aide.
05/06/2007, 19h27
FremyCompany

Ben je ne vois pas ou il manque qqchose...

Un string ne peut pas s'étaler sur plusieurs lignes, pour les passages à la ligne, il faut utilser "\n"...

script final

j'ai cherché un peu et voici le script que j'avais finalement mis au point. Il permet d'ajouter une ligne à chaque clic su le bouton correspondant :

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
<script type="text/javascript">
var i=0;
var j=0;
function AddRow(){
	i++;
    var newRow = document.getElementById('table').insertRow(-1);
    var newCell = newRow.insertCell(0);
    newCell.innerHTML = '<center><select name="operation['+i+']"><option value=1> Création </option><option value=2> Suppression </option></center>';
    newCell = newRow.insertCell(1);
    newCell.innerHTML = '<center><select name="pression['+i+']"><option value=1> MPB </option><option value=2> BP </option><option value=3> MPC </option></center>';
    newCell = newRow.insertCell(2);
    newCell.innerHTML = '<center><select name="matiere['+i+']"><option value=1> PE </option><option value=2> Acier </option><option value=3> Fonte grise </option><option value=4> Fonte ductile </option><option value=5> Plomb </option><option value=6> Cuivre </option></center>';
    newCell = newRow.insertCell(3);
    newCell.innerHTML = '<center><input type="text" name="calibre['+i+']" size="3" maxlength="3"></center>';
    newCell = newRow.insertCell(4);
    newCell.innerHTML = '<center><input type="text" name="annee['+i+']" size="4" maxlength="4"></center>';
    newCell = newRow.insertCell(5);
    newCell.innerHTML = '<center><input type="text" name="longueur['+i+']" value=0></center>';
    newCell = newRow.insertCell(6);
    newCell.innerHTML = '<center><select name="nature['+i+']"><option value=1> Gaz naturel </option><option value=2> Air </option><option value=3> Propane </option></center>';
}
function envoi()
{
document.getElementById('ii').value=i;
}
</script>
 
 
<a href="Javascript:AddRow();"><img src="/web/visucarto/image/Btn_Ajouter.gif" border="0" width="70" height="19"></a>

Previens moi s'il te manque quelque chose...

06/06/2007, 10h19
batotoba

J'ai fait la même chose. J'ai un indice qui compte le nombre de lignes et je change le nom de chaque variable an fct de cet indice.
Merci pour vos reponses.