[JavaScript] [SRC] Name d'un élément de formulaire ajouté dynamiquement

[SpaceFrog]

Le problème:

L'attribution dynamique d'un name à un élément de formulaire créé dynamiquement pose problème.
Prenons un exemple avec un input, pour ajouter un input vous auriez sasn doute fait :

Code :

1
2
3
4
5
6
7
8
9
10
 
function AddInput() {
     var MonForm = document.forms[0];
    var newInput = document.createElement("input");
     newInput.name  = "bidule";
     newInput.type  = "text";
     newInput.id    = "bidule_1";
     newInput.value = "le contenu";
     MonForm.appendChild(newInput);
 }

Ho merveille l'input apparaît bien sur la page!!!
Mais vous auriez vite déchanté en vous apercevant que:

• D'une part le name n'est pas reconnu coté client :
  
  Code :

  1
  2
  document.getElemetsByName("bidule")
  documents.forms[0].elements['bidule']

  retournent element has no propriety ...
• D'autre part ce qui est encore plu gênant le contenu n'est pas transmis à la soumission du formulaire

Une solution pour que le contenu de cet élément soit transmis lors de la soumission du formulaire est d'utiliser cette syntaxe :

Code :

input.NAME  = "bidule";

curieusment le fais de mettre NAME en majuscule permet le passage de la valeur au serveur ...
Cependant l'inout n'est toujours pas reconnu par son name sur la page coté cleint.
On peut éventuellement lui attribuer un id et l'appeler par

Code :

document.getElementById('bidule_1')

La solution est au moment de la création d'utiliser cette syntaxe:

Code :

1
2
3
4
5
6
7
8
9
 
function AddInput() {
     var MonForm = document.forms[0];
    var newInput = document.createElement("<input name='bidule' />")
     newInput.type  = "text";
     newInput.id    = "bidule_1";
     newInput.value = "le contenu";
     MonForm.appendChild(newInput);
 }

Et tout rentre dans l'ordre l'input est reconnu par son name et envoyé sur le serveur !

[Auteur]

Ta discussion me fait penser à un (très) vieux sujet sur getElementsByName : IE et Firefox n'ont pas le même comportement vis à vis de l'attribut name et de la méthode getElementsByName().

[FremyCompany]

Code :

	var newInput = document.createElement("<input name='bidule' />")

Ca marche sur FF ca ?
Je croyais que c'était IE-Only ?

[SpaceFrog]

oulà ! je suis super déçu
Il semblerait en effet que cette suntaxe ne passe pas sous firefox ...
J'étais persuadé qu'elle était crossBrowser ...

[FremyCompany]

Bah, reste plus que la bonne vieille méthode du browser-conditional