Edit data in Primefaces dialog - primefaces

How I can edit data in form? I have this Primefaces dialog which hI wants to use to edit data.
<p:dialog header="System User Details" widgetVar="carDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="true">
<p:outputPanel id="carDetail" style="text-align:center;">
<p:panelGrid columns="2" rendered="#{not empty systemusers.selectedSystemUser}" columnClasses="label,value">
<h:outputText value="Username" />
<h:outputText value="#{systemusers.selectedSystemUser.username}" />
<h:outputText value="Last Login" />
<h:outputText value="#{systemusers.selectedSystemUser.lastLogin}" />
.........
<h:outputText value="Action" />
<h:outputText value="Download Delete" />
</p:panelGrid>
</p:outputPanel>
</p:dialog>

Firstly you would need to have an <h:form /> component inside of the <p:dialog /> component tags. You would also need to change the outputText components to that of inputText.
You could use a <p:commandButton to confirm and persist the input. For example:
<p:dialog header="System User Details" widgetVar="carDialog" modal="true" appendTo="#body">
<h:form id="dialogForm">
<p:outputLabel for="username" value="Username">
<p:inputText id="username" value="#{systemusers.selectedSystemUser.username}" required="true" requiredMessage="Value is required" label="Username" />
....
<p:commandButton value="Submit" update=":mainForm" actionListener="#{beanName.updateData}" oncomplete="PF('cardDialog').hide()" />
<p:commandButton value="Cancel" type="button" onclick="PF('cardDialog').hide()" />
</h:form>
</p:dialog>

Related

parameter goes null when using <p:commandButton> (Mojarra 2.3)

the xhtml file is getting a Integer parameter which is saved as deck_id. In that xhtml file it is used normally and it works as in the header but when i want to combine it with a <p:commandbutton> the param goes to null. I dont know why and I have no idea how to solve it.
As i am new in programming and that is my first project I am lost right now and hours of google didnt help.
the deck_id works fine in #{deckListController.getDeckByDeckId(deck_id).name} but doesnt work anymore at
<p:commandButton oncomplete="PF('newCardDialog').show()"
icon="pi pi-plus" value="new card" title="New">
-->
By pressing the New Card Button i just added a function which prints the deck_id (as u can see in the newCardDialog) in the console and it prints 0 but it should be the ID of the given deck.
xhtml file deck-detail view
<ui:param name="deck_id" value="#{param['deck_id']}"/>
<ui:define name="content">
<h1>Cards of
#{deckListController.getDeckByDeckId(deck_id).name}</h1>
<div class="deck-detail">
<!-- TODO: ADD NEW CARD -->
<h:form id="newCardForm">
<div class="txt-r">
<!-- TODO: only see for the creator of the deck -->
<!-- one Problem -> deckId somehow is null -> exception becaus of unboxing null is wrong -->
<p:commandButton oncomplete="PF('newCardDialog').show()"
icon="pi pi-plus" value="new card" title="New">
<!-- rendered="#{deckListController.getDeckByDeckId(param['deck_id']).createUser == sessionInfoBean.currentUser}"> -->
</p:commandButton>
<p:commandButton oncomplete="PF('deckEditDialog').show()"
icon="pi pi-pencil" value="edit deck" title="Edit" styleClass="btn-light">
<f:setPropertyActionListener
value="#{deckListController.getDeckByDeckId(deck_id)}"
target="#{deckDetailController.deck}" />
</p:commandButton>
</div>
<br />
<!-- new Card dialog -->
<p:dialog header="Create new Card" id="newCardDialog"
widgetVar="newCardDialog" modal="true" showEffect="fade"
hideEffect="fade" resizable="false" width="400">
<p:outputPanel id="newCardData">
<p:messages id="messages" closable="true" autoUpdate="true" />
<h:panelGrid columns="2">
<p:outputLabel for="cardContentFront" value="Question: " />
<!-- TODO: required field check is not working yet -->
<p:inputTextarea id="cardContentFront"
value="#{newCardController.card.contentFront}" required="true"
requiredMessage="Question of card is required" />
<p:outputLabel for="cardContentBack" value="Answer: " />
<p:inputTextarea id="cardContentBack"
value="#{newCardController.card.contentBack}" required="true"
requiredMessage="Answer of card is required" />
</h:panelGrid>
<p:separator />
<h:panelGrid columns="2">
<p:outputLabel for="flipped" value="Flipped: " />
<p:selectBooleanCheckbox id="flipped"
value="#{newCardController.card.flipped}" />
</h:panelGrid>
<p:separator />
<h:panelGrid columns="3">
<p:commandButton value="Cancel"
onclick="PF('newCardDialog').hide()" styleClass="btn-light" />
<!-- TODO: after create refreshing of the table -->
<p:commandButton value="Create"
actionListener="#{cardListController.print(deck_id)}"
oncomplete="PF('newCardDialog').hide()" />
<!-- action="#{newCardController.doCreateCard(deck_id)}" -->
<!-- update="cardForm" /> -->
</h:panelGrid>
</p:outputPanel>
</p:dialog>
<!-- Edit deck dialog -->
<p:dialog header="Edit #{deckListController.getDeckByDeckId(param['deck_id']).name}" id="deckEditDialog"
widgetVar="deckEditDialog" modal="true" showEffect="fade"
hideEffect="fade" resizable="false" width="400">
<p:outputPanel id="deckData" rendered="#{ empty deckDetailController.deck}">
<h:panelGrid columns="2">
<p:outputLabel for="name" value="Deck Name: " />
<p:inputText id="name" disabled="false" />
<p:outputLabel for="description" value="Desription: " />
<p:inputTextarea id="description" disabled="false" />
</h:panelGrid>
<h:panelGrid columns="2">
<p:outputLabel for="public" value="Public: " />
<p:selectBooleanCheckbox id="public" />
</h:panelGrid>
<h:panelGrid columns="3">
<p:commandButton value="Cancel"
onclick="PF('deckEditDialog').hide()" styleClass="btn-light" />
<p:commandButton value="Reload"
update=":cardForm:cardView"
styleClass="btn-light" />
<p:commandButton value="Save"
oncomplete="PF('deckEditDialog').hide()"
update=":cardForm:cardView" />
</h:panelGrid>
</p:outputPanel>
</p:dialog>
</h:form>
<h:form id="cardForm">
<p:dataGrid id="cardView" var="card"
value="#{cardListController.getEnabledCardsOfOneDeckByDeckId(deck_id)}"
columns="4" paginator="false">
<p:dataViewGridItem>
<h3 class="card-name">Question:</h3>
<div class="card-grid-item-content">
<p class="card-contentFront">#{card.contentFront}</p>
</div>
<div class="open-btns txt-r">
<!-- TODO: edit and delete button in Progress -->
<p:commandButton update=":cardForm:cardEditDialog"
oncomplete="PF('cardEditDialog').show()"
type="button" title="edit" value="edit" styleClass="btn-light"
rendered="#{card.createUser == sessionInfoBean.currentUser}">
<f:setPropertyActionListener value="#{card}"
target="#{cardDetailController.card}" />
</p:commandButton>
<p:commandButton title="delete"
action="#{cardDetailController.doDisableCard}"
rendered="#{card.createUser == sessionInfoBean.currentUser}">
<f:setPropertyActionListener value="#{card}"
target="#{cardDetailController.card}" />
<p:confirm header="Confirmation"
message="Are you sure you want do delete this card?"
icon="pi pi-exclamation-triangle" />
</p:commandButton>
</div>
</p:dataViewGridItem>
</p:dataGrid>
<!-- Edit card dialog -->
<p:dialog header="Edit Card" id="cardEditDialog"
widgetVar="cardEditDialog" modal="true" showEffect="fade"
hideEffect="fade" resizable="false" width="400">
<p:outputPanel id="cardData"
rendered="#{not empty cardDetailController.card}">
<h:panelGrid columns="2">
<p:outputLabel for="contentFront" value="Question: " />
<p:inputText id="contentFront"
value="#{cardDetailController.card.contentFront}"
disabled="false" />
<p:outputLabel for="contentBack" value="Answer: " />
<p:inputTextarea id="contentBack"
value="#{cardDetailController.card.contentBack}"
disabled="false" />
</h:panelGrid>
<h:panelGrid columns="3">
<p:commandButton value="Cancel"
onclick="PF('cardEditDialog').hide()" styleClass="btn-light" />
<p:commandButton value="Reload"
action="#{cardDetailController.doReloadCard()}"
update=":cardsForm:cardView" styleClass="btn-light" />
<p:commandButton value="Save"
action="#{cardDetailController.doSaveCard()}"
oncomplete="PF('cardEditDialog').hide()"
update=":cardForm:cardView" />
</h:panelGrid>
</p:outputPanel>
</p:dialog>
<!-- Deletion confirmation dialog -->
<p:confirmDialog global="true" showEffect="fade" hideEffect="fade"
width="300">
<p:commandButton value="Yes" type="button"
styleClass="ui-confirmdialog-yes btn-light" />
<p:commandButton value="No" type="button"
styleClass="ui-confirmdialog-no" />
</p:confirmDialog>
</h:form>
</div>
</ui:define>
</ui:composition>
xhtml file where the param is given to deck-detail view
<ui:composition xmlns="http://www.w3c.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<div class="personal-decks">
<h:form id="newDeckForm">
<div class="txt-r">
<p:commandButton oncomplete="PF('newDeckDialog').show()"
icon="pi pi-plus" value="new deck" title="New" />
</div>
<br />
<!-- NEW deck dialog-->
<p:dialog header="Create new Deck" id="newDeckDialog"
widgetVar="newDeckDialog" modal="true" showEffect="fade"
hideEffect="fade" resizable="false" width="400">
<p:outputPanel id="newDeckData">
<p:messages id="messages" closable="true" autoUpdate="true" />
<h:panelGrid columns="2">
<p:outputLabel for="deckName" value="Deck Name: " />
<!-- TODO: required field check is not working yet -->
<p:inputText id="deckName" value="#{newDeckController.deck.name}"
required="true" requiredMessage="Name of deck is required" />
<p:outputLabel for="deckDescription" value="Description: " />
<p:inputTextarea id="deckDescription"
value="#{newDeckController.deck.description}" disabled="false" />
</h:panelGrid>
<h:panelGrid columns="3">
<p:commandButton value="Cancel"
onclick="PF('newDeckDialog').hide()" styleClass="btn-light" />
<p:commandButton value="Create"
action="#{newDeckController.doCreateDeck()}">
</p:commandButton>
</h:panelGrid>
</p:outputPanel>
</p:dialog>
</h:form>
<!-- PRIVATE decks view-->
<h:form id="privateDecksForm">
<p:dataGrid id="decksView"
var="deck"
value="#{deckListController.userDecks}" columns="4"
paginator="false">
<p:dataViewGridItem>
<div class="edit-btns">
<p:commandButton update=":deckTabs:privateDecksForm:deckEditDialog"
oncomplete="PF('deckEditDialog').show()" icon="pi pi-pencil"
title="Edit">
<f:setPropertyActionListener value="#{deck}"
target="#{deckDetailController.deck}" />
</p:commandButton>
<p:commandButton action="#{deckDetailController.doDisableDeck}"
icon="pi pi-trash" title="Delete"
update=":deckTabs:privateDecksForm:decksView">
<f:setPropertyActionListener value="#{deck}"
target="#{deckDetailController.deck}" />
<p:confirm header="Confirmation"
message="Are you sure that you want to delete this deck? You cannot undo this operation."
icon="pi pi-exclamation-triangle" />
</p:commandButton>
</div>
<h3 class="deck-name">#{deck.name}</h3>
<div class="deck-grid-item-content">
<p class="deck-description">#{deck.description}</p>
<p class="deck-no-cards">
New cards: #{deckDetailController.getNewCardsCount(deck)}
<br />
Repeatable cards: #{deckDetailController.getRepeatableCardsCount(deck)}
</p>
</div>
<div class="open-btns txt-r">
<p:linkButton outcome="deck-detail" value="view"
styleClass="btn-light">
<f:param name="deck_id" value="#{deck.deckID}" />
</p:linkButton>
<p:linkButton outcome="learning-view" value="learn">
<f:param name="deck_id" value="#{deck.deckID}" />
</p:linkButton>
</div>
</p:dataViewGridItem>
</p:dataGrid>
<!-- Edit deck dialog-->
<p:dialog header="Edit Deck" id="deckEditDialog"
widgetVar="deckEditDialog" modal="true" showEffect="fade"
hideEffect="fade" resizable="false" width="400">
<p:outputPanel id="deckData"
rendered="#{not empty deckDetailController.deck}">
<h:panelGrid columns="2">
<p:outputLabel for="name" value="Deck Name: " />
<p:inputText id="name" value="#{deckDetailController.deck.name}"
disabled="false" />
<p:outputLabel for="description" value="Description: " />
<p:inputTextarea id="description"
value="#{deckDetailController.deck.description}" disabled="false" />
</h:panelGrid>
<h:panelGrid columns="2">
<p:outputLabel for="public" value="Public: " />
<p:selectBooleanCheckbox id="public"
value="#{deckDetailController.deck.publiclyShared}" />
</h:panelGrid>
<h:panelGrid columns="3">
<p:commandButton value="Cancel"
onclick="PF('deckEditDialog').hide()"
styleClass="btn-light" />
<p:commandButton value="Reload"
action="#{deckDetailController.doReloadDeck()}"
update=":deckTabs:privateDecksForm:decksView"
styleClass="btn-light" />
<p:commandButton value="Save"
action="#{deckDetailController.doSaveDeck()}"
oncomplete="PF('deckEditDialog').hide()"
update=":deckTabs:privateDecksForm:decksView" />
</h:panelGrid>
</p:outputPanel>
</p:dialog>
<!-- Deletion confirmation dialog -->
<p:confirmDialog global="true" showEffect="fade" hideEffect="fade"
width="300">
<p:commandButton value="Yes" type="button"
styleClass="ui-confirmdialog-yes btn-light" />
<p:commandButton value="No" type="button"
styleClass="ui-confirmdialog-no" />
</p:confirmDialog>
</h:form>
</div>
</ui:composition>
cardListController
package at.qe.skeleton.ui.controllers;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.Collection;
import at.qe.skeleton.model.Deck;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Component;
import at.qe.skeleton.model.Card;
import at.qe.skeleton.services.CardService;
/**
* Controller for the Card list view.
*
* This class is part of the skeleton project provided for students of the
* course "Software Architecture" offered by Innsbruck University.
*/
#Component
#Scope("view")
public class CardListController implements Serializable {
#Autowired
private CardService cardService;
/**
* Returns a list of all Cards.
*
* #return Collection
*/
public Collection<Card> getCards() {
return cardService.getAll();
}
/**
* Returns a list of all Cards.
*
* #return Collection
*/
public Collection<Card> getEnabledCardsOfOneDeckByDeckId(Integer deckId) {
if(deckId == null)
return new ArrayList<>();
return cardService.findAllEnabledCardsByDeckId(deckId);
}
public void print(int deckId) {
System.out.println("deckId is " + deckId);
}
/**
* Returns the current Deck.
*
* #return Deck
*/
public Deck getDeck(Integer deckId) {
return cardService.findDeck(deckId);
}
}
i tried to change action to actionListener as somebody said in a forum.
and i figured out it may has to do with Mojarra but dont really underdtand why.

p: dialog is not working as expected?

i have two p:commandLink:
<p:commandLink update=":form:livreDetail" oncomplete="PF('livreDialog').show()" title="View Detail">
<h:outputText styleClass="ui-icon ui-icon-search" style="margin:0 auto;" />
<f:setPropertyActionListener value="#{livre}" target="#{livreDataGridView.selectedLivre}" />
</p:commandLink>
<p:commandLink update=":form:ajoutPanel" oncomplete="if(#{ empty loginBean.c }){PF('connectDialog').show()}else {PF('ajoutLivrePanier').show()} " title="ajouter au panier">
<h:outputText styleClass="ui-icon ui-icon-cart" style="margin:0 auto;" />
<f:setPropertyActionListener value="#{livre}" target="#{livreDataGridView.selectedLivre}" />
</p:commandLink>
The first p:commandLink one is showing and updating the content of livreDialog p:dialog.
The second p:commandLink should show connectDialog p:dialog when loginBean.c property is null, and ajoutLivrePanier p:dialog when is not.
my code works correctly when the loginBean property is null. But when is not it gives strange results:
When i click the first p:commandLink it only shows the livreDialog p:dialog without updating it's content. Also the validation message of the connectDialog p:dialog is shown up. it is weird !!
When i click the second p:commandLink only the validation message of connectDialog p:dialog is shown up, Weird too !!
Here is the hole code:
<p:messages globalOnly="true" autoUpdate="true" showDetail="false"/>
<h:form id="form">
<p:dataGrid var="livre" value="#{livreListBean.livresList}" columns="3"
rows="12" paginator="true" id="livres"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="6,12,16">
<f:facet name="header">
Livres
</f:facet>
<p:panel header="#{livre.titre}" style="text-align:center">
<h:panelGrid columns="1" style="width:100%">
<h:outputText value="#{livre.auteur}" />
<h:outputText value="#{livre.datePublication}" />
<p:commandLink update=":form:livreDetail" oncomplete="PF('livreDialog').show()" title="View Detail">
<h:outputText styleClass="ui-icon ui-icon-search" style="margin:0 auto;" />
<f:setPropertyActionListener value="#{livre}" target="#{livreDataGridView.selectedLivre}" />
</p:commandLink>
<p:commandLink update=":form:ajoutPanel" oncomplete="if(#{ empty loginBean.c }){PF('connectDialog').show()}else {PF('ajoutLivrePanier').show()} " title="ajouter au panier">
<h:outputText styleClass="ui-icon ui-icon-cart" style="margin:0 auto;" />
<f:setPropertyActionListener value="#{livre}" target="#{livreDataGridView.selectedLivre}" />
</p:commandLink>
</h:panelGrid>
</p:panel>
</p:dataGrid>
<p:dialog header="Info Livre" widgetVar="livreDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="false">
<p:outputPanel id="livreDetail" style="text-align:center;">
<p:panelGrid columns="2" rendered="#{not empty livreDataGridView.selectedLivre}" columnClasses="label,value">
<h:outputText value="Titre:" />
<h:outputText value="#{livreDataGridView.selectedLivre.titre}" />
<h:outputText value="Auteur" />
<h:outputText value="#{livreDataGridView.selectedLivre.auteur}" />
<h:outputText value="Date de publication:" />
<h:outputText value="#{livreDataGridView.selectedLivre.datePublication}" />
<h:outputText value="Prix" />
<h:outputText value="$#{livreDataGridView.selectedLivre.prix}" />
</p:panelGrid>
</p:outputPanel>
</p:dialog>
<h:panelGroup id="livrePanier">
<p:dialog header="Se connecter" widgetVar="connectDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="false">
<p:outputPanel id="connecterPanel" style="text-align:center;">
<h:panelGrid columns="3" >
<p:outputLabel for="mail" value="E-mail:" />
<p:inputText id="mail" value="#{loginBean.email}" required="true" requiredMessage="Vous devez entrer votre e-mail"/>
<p:message for="mail"/>
<p:outputLabel for="password" value="Password:" />
<p:password id="password" value="#{loginBean.password}" required="true" requiredMessage="Vous devez entrer votre password"/>
<p:message for="password"/>
<p:commandButton value="Se connecter" action="#{loginBean.LoginProcess()}" process="connecterPanel" update="connecterPanel"/>
</h:panelGrid>
</p:outputPanel>
</p:dialog>
<p:dialog header="Ajouter au panier" widgetVar="ajoutLivrePanier" modal="true" showEffect="fade" hideEffect="fade" resizable="false">
<p:outputPanel id="ajoutPanel" style="text-align:center;" rendered="#{not empty livreDataGridView.selectedLivre}">
<p:outputLabel value="Voulez vous ajouter ce produit au panier ?"/>
<h:panelGrid columns="2" >
<p:outputLabel value="#{livreDataGridView.selectedLivre.titre}" />
<p:outputLabel value="#{livreDataGridView.selectedLivre.prix}" />
<p:commandButton value="Oui" action="#{livreDataGridView.ajouterLivreAuPanier()}" process="connecterPanel" update="connecterPanel" oncomplete="PF('ajoutLivrePanier').hide()"/>
<p:commandButton value="Annuler" onclick="PF('ajoutLivrePanier').hide()"/>
</h:panelGrid>
</p:outputPanel>
</p:dialog>
</h:panelGroup>
</h:form>
i'll appreciate your help to fix the problem
You need process="#this" on your commandLinks. Without it JSF processes the whole form, that's why you see those validation failures, which in turn cause the Invoke Application phase to be skipped.
See also: Understanding PrimeFaces process/update and JSF f:ajax execute/render attributes.

p:blockUI / pe:blockUI: Why doesn't it work in my simple example?

I would like to hide an element while a button triggered action is being performed:
<h:form id="sendtxform">
<p:panelGrid columns="1" styleClass="ui-noborder">
<pe:blockUI block="input" widgetVar="blockUIWidget">
LOADING<br />
<p:graphicImage name="images/ajax-loader.gif" />
</pe:blockUI>
<p:commandButton id="command" value="ISSUE APP"
actionListener="#{transactionXmlController.getTxDataPredefined}"
ajax="true" update="growl,input"
onstart="PF('blockUIWidget').block();"
oncomplete="PF('blockUIWidget').unblock();">
</p:commandButton>
<p:inputTextarea id="input" cols="150" rows="30" autoResize="false"
value="#{transactionXmlEditableModel.xml}" />
</p:panelGrid>
</h:form>
I tried with p:blockUI / pe:blockUI and with/without the onstart and oncomplete attributes.
What am I doig wrong ? I use blockUI somewhere else, and it is working fine:
The only difference is that the table is its own trigger.
I followed this tutorial.
Block the input seems to not work, you can wrap the input with a panel and block it.
PrimeFaces Extensions:
<h:form id="sendtxform">
<p:panelGrid columns="1" styleClass="ui-noborder">
<pe:blockUI target="panel" widgetVar="blockUIWidget">
LOADING<br />
<p:graphicImage name="images/ajax-loader.gif" />
</pe:blockUI>
<p:commandButton id="command" value="ISSUE APP"
actionListener="#{transactionXmlController.getTxDataPredefined}"
ajax="true" update="input"
onstart="PF('blockUIWidget').block();"
oncomplete="PF('blockUIWidget').unblock();">
</p:commandButton>
<p:panel id="panel">
<p:inputTextarea id="input" cols="150" rows="30" autoResize="false"
value="#{transactionXmlEditableModel.xml}" />
</p:panel>
</p:panelGrid>
</h:form>
PrimeFaces:
<h:form id="sendtxform">
<p:panelGrid columns="1" styleClass="ui-noborder">
<p:blockUI block="panel" trigger="command">
LOADING<br />
<p:graphicImage name="images/ajax-loader.gif" />
</p:blockUI>
<p:commandButton id="command" value="ISSUE APP"
actionListener="#{transactionXmlController.getTxDataPredefined}"
ajax="true" update="input">
</p:commandButton>
<p:panel id="panel">
<p:inputTextarea id="input" cols="150" rows="30" autoResize="false"
value="#{transactionXmlEditableModel.xml}" />
</p:panel>
</p:panelGrid>
</h:form>

Primefaces p:dialog modal="true" appendToBody it´s not working

I tried many things for this workaround, but now I found a issue with p:dialog.
If I use modal="false" everything works fine.
But if I use modal="true" and appendTo="#(body)" and want to use a footer the p:dialog doesnt work.
The h:form doesn´t validate the fields.
<p:dialog message="Add Ticket" header="Add Ticket"
draggable="true" resizable="true" closeOnEscape="true"
appendTo="#(body)" modal="true" widgetVar="addTicketReportingDialog">
<h:form id="addTicketReportingForm">
<h:panelGrid id="ticketReportingAddPanelGrid" columns="2">
<p:outputLabel for="ticketReporting_name" value="Name:" />
<p:inputText id="ticketReporting_name" size="33" required="true"
requiredMessage="Please add a value"
value="#{ticketReportingEditController.ticketReporting.title}" />
</h:panelGrid>
<br></br>
<f:facet name="footer">
<p:commandButton value="Save"
oncomplete="if (!args.validationFailed) addTicketReportingDialog.hide()"
update=":ticketReportingListForm:ticketReportingListDatatable,messagesAddTicketReporting,:addTicketReportingForm:ticketReportingAddPanelGrid"
actionListener="#{ticketReportingEditController.doSave}"
ajax="true" />
<h:outputText value=" or " />
<p:commandLink ajax="true" process="#this"
onclick="addTicketReportingDialog.hide();">
<h:outputText value="Close" />
</p:commandLink>
<p:messages id="messagesAddTicketReporting" showDetail="false"
for="messagesAddTicketReporting" autoUpdate="false"
closable="true" />
</f:facet>
</h:form>
</p:dialog>

Primefaces Datagrid: Dialog not getting updated with selected values

I have an issue with primefaces datagrid.I am trying to update the dialog box with the selected values on click of p:commandLink.
The Dialog doesnt display any values initially but it gets updated with the previously selected values when i refresh the page and click on commandLink.
I am using primefaces-2.2.1 on JBoss 4.3.0.Any help would be appreciated.
<p:column>
<p:panel header="#{loc.loc_details}" style="text-align:center">
<h:panelGrid columns="1" style="width:100%">
<p:graphicImage value="/user/xyz/resources/images/#{loc.loc_details}.jpg"/>
<h:outputText value="#{loc.locality}" />
<h:outputText value="#{loc.city}" />
<h:outputText value="#{loc.state}" />
<p:commandLink update="locDetail,locDetailGrid" oncomplete="locDialog.show()" title="View Detail" border="0" >
<p:graphicImage value="/user/xyz/resources/images/imagesCA6ETPOM.jpg" />
<f:setPropertyActionListener value="#{loc}"
target="#{tutorialsBean.selectedLocality}" />
</p:commandLink>
</h:panelGrid>
</p:panel>
</p:column>
<p:dialog header="Loc Detail" widgetVar="locDialog" modal="true">
<p:outputPanel id="locDetail" style="text-align:center;" layout="block">
<h:panelGrid id="locDetailGrid" columns="2" cellpadding="5">
<h:outputLabel for="loc_details" value="Locality Details :" />
<h:outputText id="loc_details" value="#{tutorialsBean.selectedLocality.loc_details}" />
<h:outputLabel for="city" value="City: " />
<h:outputText id="city" value="#{tutorialsBean.selectedLocality.city}" />
<h:outputLabel for="state" value="State: " />
<h:outputText id="state" value="#{tutorialsBean.selectedLocality.state}" />
<h:outputText styleClass="text_normal" value="First Name" />
<p:inputText id="fnameText" value="#{tutorialsBean.firstName}" />
<h:outputText styleClass="text_normal" value="Last Name" />
<p:inputText id="lnameText" value="#{tutorialsBean.lastName}" />
<h:outputText styleClass="text_normal" value="Email" />
<p:inputText id="emailText" value="#{tutorialsBean.email}" />
<p:commandButton id="searchButton"
value="Submit" action="#{tutorialsBean.submitValues}"
styleClass="button" />
</h:panelGrid>
</p:outputPanel>
in you commandLink add the update and process attributes in your dialog to refresh the information.
like this:
Put the ID in dialog:
<p:dialog header="Loc Detail" id="locDialog" widgetVar="locDialog" modal="true">
Put the Update to dialog:
<p:commandLink update="locDetail,locDetailGrid" oncomplete="locDialog.show()" title="View Detail" border="0" update="locDialog" process="#this" ajax="true" partialSubmit="true" >
<p:graphicImage value="/user/xyz/resources/images/imagesCA6ETPOM.jpg" />
<f:setPropertyActionListener value="#{loc}" target="#{tutorialsBean.selectedLocality}" />
</p:commandLink>