Bonjour,
J'essaie de jouer avec la méthode .clone() pour créer des éléments de formulaire identiques mais le thème appliqué à mes éléments n'est pas cloné... Et impossible de l'appliquer après coup.
J'ai mis un exemple sur jsFiddle : http://jsfiddle.net/JbHnh/
Ce que j'essaie de faire, c'est qu'en cliquant sur "Add", mon select soit dupliqué à l'identique, dans le même div que le premier. Et évidemment : que chaque select soit indépendant : pouvoir sélectionner une valeur dans l'un et une autre valeur dans l'autre. La "clonage" fonctionne, mais je ne comprend pas pourquoi le data-theme n'est pas appliqué, malgré le paramètre passé à clone().
Le code :
Code html : 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 <form id="formHU"> <div class="ui-grid-a" id="blkSaisie"> <div class="ui-block-a" id="divWin"> <select data-mini="true" data-theme="a" id="vainqueur1" name="vainqueur[]"> <option value="play1">Player 1</option> <option value="play2">Player 2</option> <option value="play3">Player 3</option> </select> </div> </div> </form> <div id="blkBtn"> <div class="ui-grid-a"> <div class="ui-block-a"> <a id="btnDel" name="btnDel" data-role="button" data-theme="e" data-icon="delete" data-inline="true" data-iconpos="left" data-mini="true">Del</a> </div> <div class="ui-block-b"> <a id="btnAdd" name="btnAdd" data-role="button" data-theme="e" data-icon="plus" data-inline="true" data-iconpos="left" data-mini="true">Add</a> </div> </div> </div>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 var nbLigne = 1; $("#btnAdd").click(function () { nbLigne++; var blkW = $("#vainqueur1").clone(true); blkW.attr("id", "vainqueur" + nbLigne); $("#divWin").append(blkW); }); $("#btnDel").click(function () { if (nbLigne > 1) { $("#vainqueur" + nbLigne).remove(); nbLigne--; } });
Partager