Bonjour j'ai trouver sur le net un script qui explique comment cloner une zone modèle html en javascript et y modifier ces attribus, en suivant le même principe j'ai rajouter un éléments permettant de récupérer la valeur du compteur en cours pour travailler le contenu de la zone modèle dupliquée, voila ce que ça donne:

HTML
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
 
<select id="select_modele" name="modele" style="display:none;">
   <option value="blabla1">TEXTE1</option>
   <option value="blabla2">TEXTE2</option>
   <option value="blabla3">TEXTE3</option>
</select>
<input type="hidden" name="input" id="input_modele" value="-2" />
<div id="Cible"> </div>
<button onclick="javascript:addSelect('contrat');" type="button">Ajouter un contrat</button>
JS
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
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
      var i=0;
      function addSelect(typ_select)
      {
        i++;
        // On récupère l'endroit où devra être ajouté la liste
        var Cible = document.getElementById("Cible");
 
        // On récupère la liste modèle
        var liste = document.getElementById("select_modele");
        // On la clone dans une nouvelle variable
        var nvxListe = liste.cloneNode(true);
 
        // On récupère l'input modèle
        var input = document.getElementById("input_modele");
        // On la clone dans une nouvelle variable
        var nvxInput = input.cloneNode(true);
 
        // creation d'un saut de ligne
        var br = document.createElement("br");
 
 
        // On adapte les attributs de la nouvelle liste
        nvxListe.name = typ_select + i;
        nvxListe.style.display = "inline";
 
        // On cree l'input qui contiendra a chaque fois la valeur du i ce qui nous permettra de pouvoir faire les enregistrement
        nvxInput.name = typ_select;
        nvxInput.id = typ_select;
        nvxInput.value = i;
        nvxInput.type = "hidden";
 
 
        // On ajoute tout ça à l'emplacement voulu
        Cible.appendChild(nvxListe);
        Cible.appendChild(nvxInput);
        Cible.appendChild(br);
      }
J'ai voulu tester si il y avait moyen de cloner une zone plus complexe tel qu'un div, et cela fonctionne via la même manière...

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
16
17
18
19
20
21
22
23
24
25
26
27
28
 
                        <!-- ____________DEBUT DE LA ZONE MODELE (NON VISIBLE)______________ -->  
                        <div id="modele" style="display:none;">
                        <table>                                                              
                          <tr>
                            <td>TITRE</td>
                            <td>
                               <select id="select_modele" name="modele" style="display:none;">
                                 <option value="blabla1">TEXTE1</option>
                                 <option value="blabla2">TEXTE2</option>
                                 <option value="blabla3">TEXTE3</option>
                               </select>
                             </td>
                          </tr>
                          <tr>
                            <td><label for="dain">Date d entrée : </label></td>
                            <td><input type="text" name="dain" id="dain" value="X" tabindex="40" /><br /></td>
                          </tr>
                          <tr>
                            <td><label for="danom">Date de nomination : </label></td>
                            <td><input type="text" name="danom" id="danom" value="X" tabindex="40" /><br /></td>
                          </tr>    
                        </table>           
                        </div>
                        <input type="hidden" name="input" id="input_modele" value="-2" />                             
                        <!-- ______________FIN DE LA CREATION DE LA ZONE MODELE_____________ -->
<div id="Cible"> </div>
<button onclick="javascript:addSelect('contrat');" type="button">Ajouter un contrat</button>
JS
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
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
      var i=0;
      function addSelect(typ_select)
      {
        i++;
        // On récupère l'endroit où devra être ajouté la liste
        var Cible = document.getElementById("Cible");
 
        // On récupère la liste modèle
        var div = document.getElementById("modele");
        // On la clone dans une nouvelle variable
        var nvxDiv = div.cloneNode(true);
 
        // On récupère l'input modèle
        var input = document.getElementById("input_modele");
        // On la clone dans une nouvelle variable
        var nvxInput = input.cloneNode(true);
 
        // creation des attribus td du tableau de la page principale
        var br = document.createElement("br");
 
 
        // On adapte les attributs de la nouvelle liste
        nvxDiv.name = typ_select + i;
        nvxDiv.style.display = "inline";
 
        // On cree l'input qui contiendra a chaque fois la valeur du i ce qui nous permettra de pouvoir faire les enregistrement
        nvxInput.name = typ_select;
        nvxInput.id = typ_select;
        nvxInput.value = i;
        nvxInput.type = "hidden";
 
 
        // On ajoute tout ça à l'emplacement voulu
        Cible.appendChild(nvxDiv);
        Cible.appendChild(nvxInput);
        Cible.appendChild(br);
      }
Cela fonctionne, je copie l'entièreté de mon div, mais il me vient une question:
Y a t'il moyen d'aller chercher les attributs des éléments contenu dans le div et de les modifier de la même manière que pour le div lui même?

Je répondrais oui a première vue, car je clone un div ayant du contenu, et donc pour moi ce contenu peut être modifié(fin selon MA logique lol).
Si c'est bien oui, la question que je me poserai alors c'est comment ?
Si c'est non, je suppose donc que je dois créer tout des éléments modèle afin de les modifier 1 par 1 dans le script?


PS: Si vous voyez des aberrations dans le code, soyez indulgent et dite le moi car je débute en javascript et je ne connais absolument pas ces possibilités.

Merci d'avance