CloneNode et input radio

Salut salut,
Je rajoute actuellement des éléments à mon formulaire avec quelque chose comme ça :

function addUserForm(){
          var _div=document.getElementById('bloc_add_user');
          
          var _txt=document.createElement('input');
          _txt.setAttribute('name','user_name[]');
          _txt.setAttribute('value','son pseudo');
          _div.appendChild(_txt); // on ajoute le text input à la div
          
           var _lab1=document.createElement('label');
          _lab1.setAttribute('id','admin');
          _lab1.appendChild(document.createTextNode(' Admin'));

          var _radio1=document.createElement('input');
          _radio1.setAttribute('type','radio');
          _radio1.setAttribute('name','status_');
          _radio1.setAttribute('value','A');

          _lab1.appendChild(_radio1); 
          _div.appendChild(_lab1); 
                
          var _lab2=document.createElement('label');
          _lab2.setAttribute('id','officer');
          _lab2.appendChild(document.createTextNode(' Officer'));

          var _radio2=document.createElement('input');
          _radio2.setAttribute('type','radio');
          _radio2.setAttribute('name','status_');
          _radio2.setAttribute('value','O');

          _lab2.appendChild(_radio2);
          _div.appendChild(_lab2);
          var _br=document.createElement('br');
          _div.appendChild(_br);          
    }

C'est un exemple, le code en production est légèrement différent (gestion des tours+event associés)
La question c'est : est ce que je peux optimiser la chose avec cloneNode ? J'ai peur au sujet de mes boutons radio, ils risquent d'avoir tous le même name et donc le comportement associés.

Merci beaucoup, j'espère que j'ai été pour une fois compréhensible

Salut,

Avant toute chose, j'aurais une petite question : Est-ce que les éléments que tu crées sont optionnels ? Si la réponse est non, mets les dans le html plutôt que de les créer via JS, faute de quoi, un utilisateur qui ne dispose pas de JS ne peut se servir correctement de ton application.

Concernant cloneNode, ça n'optimiserait pas vraiment puisque tu es contraint par la suite de modifier les valeurs des attributs.

Par ailleurs, une fonction est surtout utile lorsqu'elle est réutilisable. En ce sens, les éléments que tu crées devraient pouvoir s'insérer au sein de n'importe quel conteneur donc plutôt que d'identifier celui-ci (var _div) au sein de ta fonction, mieux vaut passer l'élément en paramètre.
Il en va de même pour les paramètres des éléments suivants. Par exemple, tu te sers à maintes reprises de document.createElement mais la seule chose qui change est la chaine texte que tu y insères... donc pourquoi ne pas la passer elle aussi en tant que paramètre ? Ca t'éviterait d'avoir à la réécrire à chaque élément créé.

Enfin, lorsqu'une propriété d'un élément existe au sein du langage, mieux vaut passer par elle plutôt que par setAttribute et ce, pour des raisons de compatibilité. En d'autres termes, préfère _lab1.id = 'admin'; à _lab1.setAttribute('id','admin');.
Modifié par koala64 (27 Jul 2008 - 10:19)

Salut salut Koala64,
Merci d'avoir pris du temps pour cette belle réponse.
Alors alors ...
En effet l'idée est de pouvoir rajouter n users, c'est donc optionnel voilà pourquoi la création d'éléments à la volée m'a semblé la plus adéquate.
Pour les optimisations que tu évoques au sujet de mes fonctions tu as parfaitement raison, mais le code présenté est un premier test, il est donc en effet encore sujet à optimisation.

Enfin, merci beaucoup pour les informations via setAttribute, cela me semblait plus dans l'esprit Dom de faire comme ça et je m'étais effectivement posé la question de la différence entre les deux écritures je vais voir si je trouve plus de lecture à ce sujet.