[SRC] Name d'un élément de formulaire ajouté dynamiquement
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 !
