Tableau dynamique JS + JSF : problème de passage de paramètres
salut tout le monde !
Je vous explique mon problème :
Je réalise un formulaire en JSF; ce dernier est composé de 2 tableaux 'dynamiques' Javascript, un exemple du principe est ici :
Tableau dynamique JS, exemple
J'arrive parfaitement à implémenter ça sur ma page, et le résultat est le suivant :
au départ :
http://img386.imageshack.us/img386/7...rmalww2.th.png
après quelques ajouts :
http://img234.imageshack.us/img234/176/ajoutsbg3.th.png
En fait chaque ligne est "personnalisée" à partir du choix de la première liste; les cellules suivantes peuvent alors être une liste de choix ou un champ de saisie etc.
Le code HTML généré par JSF est le suivant (juste pour les tableaux) :
Code:
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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
| <!-- TABLE DES INSTALLS-->
<table id="tabInstalls" width="98%" border="0" style='font-family: "Microsoft Sans Serif"; font-size: 9pt' cellspacing="1">
<!-- Header de la table -->
<thead>
<tr>
<th colspan="8" style="background-color: #bad4fc">Eléments à installer</th>
</tr>
<tr>
<td style="background-color: #bad4fc" align="center" width="11%">Type d'installation</td>
<td style="background-color: #bad4fc" align="center" width="19%">Application</td>
<td style="background-color: #bad4fc" align="center" width="12%">Version</td>
<td style="background-color: #bad4fc" align="center" width="18%">Destination</td>
<td style="background-color: #bad4fc" align="center" width="10%">Date souhaitée</td>
<td style="background-color: #bad4fc" align="center" width="8%">Heure souhaitée</td>
<td style="background-color: #bad4fc" align="center" width="157">Champ spécifique</td>
<td style="background-color: #bad4fc" width="3%" align="center"></td>
</tr>
</thead>
<!-- Pied de la table -->
<!-- Zone souche du clonage de ligne -->
<tfoot>
<tr>
<td>
<select id="formulaire:cboTypeInstall_0" name="formulaire:cboTypeInstall_0" class="selectOneMenu" size="1" onchange="func_4(this);" style="width: 100%">
<option value="0">Choisir...</option>
<option value="2">Intranet</option>
<option value="7">Arcad</option>
<option value="1">C/S</option>
<option value="3">Job</option>
<option value="4">Flux</option>
<option value="5">Catmat</option>
<option value="6">PSS</option>
</select>
</td>
<td>Non requis</td>
<td>Non requis</td>
<td>
<input id="formulaire:txtDestination_0" type="text" name="formulaire:txtDestination_0" class="inputText" style="width: 100%" /></td>
<td>
<input id="formulaire:txtDateSouhaitee_0" type="text" name="formulaire:txtDateSouhaitee_0" class="inputText" style="width: 100%" /></td>
<td>
<input id="formulaire:txtHeureSouhaitee_0" type="text" name="formulaire:txtHeureSouhaitee_0" class="inputText" style="width: 100%" /></td>
<td>Non requis</td>
<td>
<input type="button" value="Ajouter" id="formulaire:btnArray_insert_0" name="formulaire:btnArray_insert_0" style="width: 100%" class="commandExButton" onclick="func_3(this);" /></td>
</tr>
</tfoot>
<!-- Corps de la table -->
<!-- Zone de réception des clones du footer -->
<tbody>
</tbody>
</table>
<!-- TABLE DES DOCS-->
<table width="98%" border="0" style='font-family: "Microsoft Sans Serif"; font-size: 9pt' cellspacing="1" id="tabDocs">
<!-- Header de la table -->
<thead>
<tr>
<th colspan="2" style="background-color: #bad4fc">Documentation à joindre</th>
</tr>
<tr>
<th style="background-color: #bad4fc" width="50%">Libellé</th>
<th style="background-color: #bad4fc" width="50%">Emplacement</th>
</tr>
</thead>
<!-- Pied de la table -->
<!-- Zone souche du clonage de ligne -->
<tfoot style="visibility: hidden">
<tr>
<th width="495">Manuel d'installation</th>
<th width="496">
<input type="file" id="formulaire:fleUpload_0" name="formulaire:fleUpload_0" class="fileupload" style="width: 100%; margin: 0px" /></th>
</tr>
</tfoot>
<!-- Corps de la table -->
<!-- Zone de réception des clones du footer -->
<tbody>
</tbody>
</table> |
Le principe du tableau dynamique est de cloner le tfoot dans le tbody côté navigateur, c'est pour ça que le tbody est vide.
Seulement voilà, lorsque je passe à la page suivante en validant mon formulaire, je fais un affichage de tous les paramètres (via une boucle) et j'obtiens :
http://img242.imageshack.us/img242/7656/paramuw4.th.png
Génant, car je n'obtiens que les champs du tfoot ! Mes éléments clonés ne sont pas là ! Je précise que pour chaque ligne clonée, je fais en sorte que les champs de saisie et listes qui lui sont associées aient un attribut id différent de ceux des autres lignes, pareil pour l'attribut name.
La seule explication que j'ai trouvé pour l'instant est que, dans le code source java de la page du formulaire, chaque champ correspond à un attribut et que les éléments clonés eux, ne correspondent à aucun attribut de la page.
En php, le traitement de ce type de tableau s'effectue correctement.
alors, limitation technologique de JSF ou incompétence de ma part ? Je débute en JSF ...
Pour info, j'utilise WDSC7, une plateforme de développement web d'IBM pour développer.
Merci de vos explications éventuelles :king:
