Discussion :

[tittoto]

Bonjour,
Je suis conscient que DOM est plus conseillé que innerHTML, mais dans mon cas cela n'a pas vraiment d'importance.
Venons en à mon problème: J'ai créé une simple fonction javascript qui permet d'ajouter un champ dans un formulaire lorsque l'on clique sur un lien.
Le premier champ s'affiche normalement mais des que je tente de rajouter d'autre champs, il ne prend pas la balise de fermeture </tr>.

Voici le code en question:

La fonction:

Code :

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

1
2
3
4
5
6
7
8
9
 
function create_indic(actualValue, indicatorName) {
  var nextValue = actualValue + 1;
 
  document.getElementById('newIndic'+actualValue).innerHTML = '<td>'+indicatorName+' N°'+actualValue+' :<input type="hidden" name="indic'+actualValue+'">';
  document.getElementById('newIndic'+actualValue).innerHTML += '</td><td><input type="text" name="libelle'+actualValue+'" id="libelle'+actualValue+'" validator="all"></td>';
  document.getElementById('newIndic'+actualValue).innerHTML += '</tr><tr id="newIndic'+nextValue+'"></tr>';
  document.getElementById('addIndic').innerHTML = '<a href="javascript:create_indic('+nextValue+',\''+indicatorName+'\')" class="blackLink">Add an indicator</a>';
}

La page HTML:

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
 
  <form name="form" method="POST" action="...">
    <tr>
      <th>        {indicator_number}
      </th>
      <th>        {libelle}
      </th>
    </tr>
    <tr id="newIndic{nextIndic}"></tr>
    <tr>....</tr>
</form>
...
<span id="addIndic">
  <a href="javascript:create_indic({nextIndic},'{indicator_name}')" class="blackLink">Add an indicator</a>
</span>

Pour rester général, la fonction créer quatre nouveaux champs:

• Premiere balise TD: Description du champ et champ hidden
• Deuxième TD: un champ de saisie
• C'est pour ce champ que j'ai un problème, en effet, il ne prend pas en compte la balise </tr> dans l'instruction:
  

  Code :

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

  1
  2
  document.getElementById('newIndic'+actualValue).innerHTML += '</tr><tr id="newIndic'+nextValue+'"></tr>';

  Et je me retrouve ainsi avec la création de la nouvelle balise <tr id="newIndic'+nextValue+'"> dans la balise actuelle; ce qui a pour effet de m'afficher l'ensemble des nouveaux champs dans la même balise <tr>

J'ai beau essayer de comprendre et d'écrire de différentes manières la fonction javascript, mais impossible de fermer la balise en cours..

Si quelqu'un aurait une idée je suis preneur

Merci d'avance

[TSalm]

peut-être faut t-il mettre un

Code :

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

<td></td><td></td>

...sans certitudes ....

[E.Bzz]

peut-être faut t-il mettre un

Code :

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

<td></td><td></td>

...sans certitudes ....

++

... avec le colspan adapté : la structure de la table doit restée cohérente

A+

[tittoto]

Merci pour vos réponse

Mais.. pardonnez moi pour mon incompétence, mais je ne vois pas du tout ou vous voulez que je place ces balises :-S. A vrai dire, je ne vois pas pourquoi les placer