prevent jsf page having datagrid to reload after a click button
abdimen May 16, 2011 6:50 PMHi,
I have a jsf page which contain a rich:dataGrid that show data from my database.
In each h: panelGrid (which represents a row of my datagrid),I have a CommandLinks that allows me to display a rich:modalPanel on the click of this CommandLinks.
My problem is that when I click the button, my modalPanel appears only for a few moments and then it disappears. The cause of this problem is that when I click the button, the jsf page reloads so the modal Panel disappears.
Please is there a trick to not to restart the page after closing the rich: modalPanel?? because i want that the user select a value from my modal panel, but i didn't find a solution to maitain this modalPanel
<rich:panel id="richPanel1"> <h:form id="formulairePanier"> <rich:panel id="richPanel2"> <f:facet name="header"> <h:outputText id="titreSousCateg" value=" *** Les produits commandés *** "></h:outputText> </f:facet> <rich:dataGrid value="#{ligneDeCommandeBean.tousLignes}" var="lignes" columns="1" elements="8" width="600px" id="dataGrid"> <center> <h:outputText value="Prix total du panier : #{ligneDeCommandeBean.prixTotalPanier}" style="FONT-SIZE: small; FONT-WEIGHT: bold; COLOR: #ff0080;" /> </center> <rich:panel bodyClass="pbody"> <f:facet name="header"> <h:outputText value=" *** "></h:outputText> </f:facet> <h:panelGrid columns="2" id="panelGrid"> <h:outputText value="N° du Panier : " styleClass="label"></h:outputText> <h:outputText value="#{lignes.panier.idPan}" /> <h:outputText value="le Client : " styleClass="label"></h:outputText> <h:outputText value="#{lignes.client.login}" /> <h:outputText value="le Produit : " styleClass="label"></h:outputText> <h:outputText value="#{lignes.produit.libeleProd}" /> <h:outputText value="Prix du Produit : " styleClass="label"></h:outputText> <h:outputText value="#{lignes.produit.prixProd}" /> <h:outputText value="Quantité : " styleClass="label"></h:outputText> <h:outputText value="#{lignes.quantComm}" id="qt"> </h:outputText> <h:outputText value="Prix Total " styleClass="label"></h:outputText> <h:outputText value="#{lignes.prixTotQt}" id="pr" /> <h:commandLink value="" id="link" style="FONT-WEIGHT: bold; FONT-SIZE: small;"> ********** Modifier quantité ********** <rich:componentControl for="modal1" attachTo="link" operation="show" event="onclick" /> <f:setPropertyActionListener target="#{ligneDeCommandeBean.id_prod}" value="#{lignes.produit.idProd}" /> <f:setPropertyActionListener target="#{ligneDeCommandeBean.libProduit}" value="#{lignes.produit.libeleProd}" /> <f:setPropertyActionListener target="#{ligneDeCommandeBean.prixUnitaire}" value="#{lignes.produit.prixProd}" /> <f:setPropertyActionListener target="#{ligneDeCommandeBean.quantite}" value="#{lignes.quantComm}" /> </h:commandLink> </h:panelGrid> </rich:panel> </rich:dataGrid> <center> <h:outputText value="Prix total du panier : #{ligneDeCommandeBean.prixTotalPanier}" style="FONT-SIZE: small; FONT-WEIGHT: bold; COLOR: #ff0080;" /> </center> </rich:panel> </h:form> </rich:panel>
and here is the code of my modalPanel (in the same page) :
<rich:modalPanel id="modal1" width="600" height="200"> <f:facet name="header"> <h:panelGroup> <h:outputText value="Modification de la quantité du produit" /> </h:panelGroup> </f:facet> <f:facet name="controls"> <h:panelGroup> <h:graphicImage value="/images/close.gif" styleClass="hidelink" id="hidelink" /> <rich:componentControl for="modal1" attachTo="hidelink" operation="hide" event="onclick" /> </h:panelGroup> </f:facet> <h:form> <h:outputText value ="Produit : + #{ligneDeCommandeBean.libProduit}"/> <br></br> <h:outputText value ="Produit : + #{ligneDeCommandeBean.prixUnitaire}"/> <h:outputText value="saisir la nouvelle quantité puis cliquez sur valider : " style="COLOR: #0080c0; FONT-WEIGHT: bold; FONT-SIZE: small;" /> <h:commandButton value="Valider" action="#{ligneDeCommandeBean.reCalculerPrix}"> </h:commandButton> <rich:inputNumberSpinner id="nouvValeurQte" value="#{ligneDeCommandeBean.quantite}" style=" width : 118px;"></rich:inputNumberSpinner> </h:form>
I am looking forwards your answers, thank you in advance.