Gestion formulaire - Tableau + création base + update base
Bonjour,
J'ai quelques petites questions pour la mise en place et la gestion d'une vue affichant sous forme de tableau les données d'une BD avec formulaire de création + modification des éléments.
Pour ce qui est de l'affichage sous forme de tableau et du dialogue de création d'une nouvelle entrée, ça marche comme souhaité.
Là ou ça se corse, c'est quand je veux modifier des données existantes.
Voici ma vue complète :
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
|
<ui:composition template="../../../secured/modele/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<ui:define name="contenu">
<h:form id="gestionSocietesForm">
<p:growl id="messages" life="2000" />
<!-- Dialogue de confirmation de suppression d'une société -->
<p:dialog header="#{msg['ConfirmerLaSuppression']}" widgetVar="confDeleteDlg" resizable="false" id="studentDlg"
showEffect="fade" hideEffect="fade" >
<p:outputLabel value="#{msg['EtesVousSurDeVouloirSupprimerCetteSociete']}" />
<div align="center">
<h:panelGrid id="display" columns="2" cellpadding="10">
<p:commandButton id="deleteButton" action="#{gestionSocietesForm.supprimerSociete}" oncomplete="handleRequest(xhr, status, args); PF('confDeleteDlg').hide()"
update=":gestionSocietesForm:societes, messages" value="#{msg['Oui']}" />
<p:commandButton id="cancelButton" onclick="PF('confDeleteDlg').hide()" value="#{msg['Non']}"/>
</h:panelGrid>
</div>
</p:dialog>
<!-- Javascript -->
<script type="text/javascript">
function handleRequest(xhr, status, args) {
// erreur ?
if(args.msgErreur) {
alert(args.msgErreur);
}
}
</script>
<!-- Menu contextuel pour suppression d'une société -->
<p:contextMenu for=":gestionSocietesForm:societes">
<p:menuitem value="Modifier" onclick="PF('societeModif').show()" />
<p:menuitem value="Supprimer" onclick="PF('confDeleteDlg').show()" update="messages" />
</p:contextMenu>
<!-- Tableau d'affichage des sociétés -->
<h2>
<h:outputText value="#{msg['GestionDesSocietes']}" />
</h2>
<p:dataTable id="societes"
value="#{gestionSocietesForm.listSocietes}"
var="societe" widgetVar="UserTable" filteredValue=""
emptyMessage="#{msg['AucuneSocieteAAfficher']}"
selection="#{gestionSocietesForm.selectedSociete}"
selectionMode="single" editable="false" editmode="row"
rowKey="#{societe.id}" paginator="true" paginatorPosition="bottom"
rows="10" style="margin-bottom:10px"
paginatorTemplate=" {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15">
<f:facet name="header">
<p:outputPanel>
<div align="left">
<p:commandLink update=":ajouterSocieteForm:societeAjout" oncomplete="PF('societeAjout').show()" id="ajoutUserLink" title="#{msg['AjouterUneSociete']}" styleClass="lienAction">
<h:outputText value="# #{msg['AjouterUneSociete']}" />
</p:commandLink>
<!-- <p:commandButton update=":ajouterSocieteForm:societeAjout" oncomplete="PF('societeAjout').show()" id="ajoutUserBtn" icon="ui-icon-action-ajouter" title="#{msg['AjouterUneSociete']}" /> -->
</div>
</p:outputPanel>
</f:facet>
<p:column style="width:5%">
<f:facet name="header">
#{msg['ID']}
</f:facet>
#{societe.id}
</p:column>
<p:column sortBy="#{societe.seqTri}" style="width:7%">
<f:facet name="header">
#{msg['SeqTri']}
</f:facet>
#{societe.seqTri}
</p:column>
<p:column sortBy="#{societe.abrege}" style="width:20%">
<f:facet name="header">
#{msg['Abrege']}
</f:facet>
#{societe.abrege}
</p:column>
<p:column style="width:30%">
<f:facet name="header">
#{msg['Nom']}
</f:facet>
#{societe.nom}
</p:column>
<p:column style="width:45%">
<f:facet name="header">
#{msg['Description']}
</f:facet>
#{societe.description}
</p:column>
</p:dataTable>
</h:form>
<!-- Dialogue d'ajout d'une société -->
<h:form id="ajouterSocieteForm">
<p:dialog header="#{msg['NouvelleSociete']}" widgetVar="societeAjout" resizable="false" id="societeAjout" focus="abrege" >
<h:panelGrid id="ajoutDial" width="500" columns="2" style="margin:0 auto;">
<h:outputLabel for="abrege" value="#{msg['SequenceDeTri']} : " styleClass="mandatory" />
<p:spinner id="seqTri" value="#{ajouterSocieteForm.seqTri}" stepFactor="10" />
<h:outputLabel for="abrege" value="#{msg['Abrege']} (10) : " styleClass="mandatory" />
<p:inputText id="abrege" value="#{ajouterSocieteForm.abrege}" size="50" maxlength="10"
required="true" requiredMessage="#{msg['AbregeEstObligatoire']}">
<p:ajax update="msgAbrege" event="blur" />
</p:inputText>
<p:outputLabel />
<p:message for="abrege" id="msgAbrege" />
<h:outputLabel for="nom" value="#{msg['Nom']} (50) : " styleClass="mandatory" />
<p:inputText id="nom" value="#{ajouterSocieteForm.nom}" required="true" requiredMessage="#{msg['NomEstObligatoire']}" size="50" maxlength="50">
<p:ajax update="msgNom" event="blur" />
</p:inputText>
<p:outputLabel />
<p:message for="nom" id="msgNom" />
<h:outputLabel for="description" value="#{msg['Description']} (2'000) : " />
<p:inputTextarea id="description" value="#{ajouterSocieteForm.description}" rows="5" cols="50" counter="countDesc" maxlength="2000" counterTemplate="{0} #{msg['Restants']}" autoResize="false" styleClass="unresizable" />
<h:outputText />
<h:outputText id="countDesc" />
<p:commandButton value="#{msg['Ajouter']}" icon="ui-icon-check"
style="margin:15px" action="#{ajouterSocieteForm.ajouterSociete}" onsuccess="PF('societeAjout').hide()" update=":gestionSocietesForm:societes" />
<p:commandButton value="#{msg['Annuler']}" icon="ui-icon-check" immediate="true"
style="margin:15px" action="#{ajouterSocieteForm.resetFields}" onclick="PF('societeAjout').hide()" />
</h:panelGrid>
</p:dialog>
</h:form>
<!-- Dialogue de modification d'une société -->
<h:form id="modifierSocieteForm">
<p:dialog header="#{gestionSocietesForm.selectedSociete.nom}" widgetVar="societeModif" resizable="false" id="societeModif" focus="seqTri" >
<h:panelGrid id="modifDial" width="500" columns="2" style="margin:0 auto;">
<h:outputLabel for="abrege" value="#{msg['SequenceDeTri']} : " styleClass="mandatory" />
<p:spinner id="seqTri" value="#{gestionSocietesForm.selectedSociete.seqTri}" />
<h:outputLabel for="abrege" value="#{msg['Abrege']} (10) : " styleClass="mandatory" />
<p:inputText id="abrege" value="#{gestionSocietesForm.selectedSociete.abrege}" size="50" maxlength="10"
required="true" requiredMessage="#{msg['AbregeEstObligatoire']}">
<p:ajax update="msgAbrege" event="blur" />
</p:inputText>
<p:outputLabel />
<p:message for="abrege" id="msgAbrege" />
<h:outputLabel for="nom" value="#{msg['Nom']} (50) : " styleClass="mandatory" />
<p:inputText id="nom" value="#{gestionSocietesForm.selectedSociete.nom}" required="true" requiredMessage="#{msg['NomEstObligatoire']}" size="50" maxlength="50">
<p:ajax update="msgNom" event="blur" />
</p:inputText>
<p:outputLabel />
<p:message for="nom" id="msgNom" />
<h:outputLabel for="description" value="#{msg['Description']} (2'000) : " />
<p:inputTextarea id="description" value="#{gestionSocietesForm.selectedSociete.description}" rows="5" cols="50" counter="countDesc" maxlength="2000" counterTemplate="{0} #{msg['Restants']}" autoResize="false" styleClass="unresizable" />
<h:outputText />
<h:outputText id="countDesc" />
<p:commandButton value="#{msg['Enregistrer']}" icon="ui-icon-check"
style="margin:15px" action="#{gestionSocietesForm.modifierSociete}" onsuccess="PF('societeModif').hide()" update=":gestionSocietesForm:societes" />
<p:commandButton value="#{msg['Annuler']}" icon="ui-icon-check" immediate="true"
style="margin:15px" action="#{modifierSocieteForm.resetFields}" onclick="PF('societeModif').hide()" />
</h:panelGrid>
</p:dialog>
</h:form>
</ui:define>
</ui:composition> |
J'ai un formulaire avec le tableau des données + 2 autres formulaires contenant chacun un dialogue (pour la création et la modification).
Je ne suis pas sûr de faire bien juste, d'autant plus que le formulaire de modification ne marche pas :aie:
Je récupère la société sélectionnée dans le premier formulaire et l'utilise pour faire le lien avec les composants du dialogue, mais le "binding" ne se fait pas.
Pour ce qui est de la sauvegarde, du coup je dois la faire dans le ManagedBean du formualaire "gestionSocietesForm" car je ne connais pas le selectedSociete dans le ManagedBean du dialogue de mise é jour.
Bref, j'ai l'impression de m'embrouiller et de faire de la m....
Comment est-ce que je devrais gérer mon cas, à savoir pouvoir créer des nouvelles sociétés et modifier celles existantes via un dialogue.
Merci d'avance pour vos conseils
