How to conditionally display a PrimeFaces confirmdialog based on back bean values? - jsf

I have a condition `{notificationSearchBean.tooLong}'. How can I create a button when if that condition is true, I want to show a confirmDialog and when its false the action will execute immediately. When the condition is true the confirmdialog is displayed and I want it to function normally: If Yes is pressed, button action should be executed, if no, the call should be aborted. This is what I have so far but it requires two clicks for it to be correct.
<h:panelGrid align="center" columns="2" id="bodyContent">
<p:commandButton value="Start Search" action="#{notificationSearchBean.getAllNotificationsForQuery}" update="bodyContent" rendered="#{!notificationSearchBean.tooLong}"/>
<p:commandButton value="Start Search" action="#{notificationSearchBean.getAllNotificationsForQuery}" update="bodyContent" rendered="#{notificationSearchBean.tooLong}">
<p:confirm header="Please narrow your search" message="Number of records fetched is #{notification.size}. Would you like to continue?"/>
</p:commandButton>
</h:panelGrid>
<p:confirmDialog global="true" showEffect="fade" hideEffect="fade" >
<p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>
<p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</p:confirmDialog>
This doesn't work as the button rendered based on what was original stored in the bean but I want it to be the new value from the current submission. How can I change this so it does that?

Related

Action of a4j:commandLink not fire after modalPanel close

I would like to call the action after click the commandLink and that choose ok to confirm and fire the action in the commandlink. But I could only open a modalPanel and close it. But the action is not invoked in the a4j:commandLink. May I ask how could I fire the action after choose "OK" of the modalPanel?
<a4j:commandLink
action="#{confManager.deleteValue(deleteValue)}"
onclick="#{rich:component('confirmation')}.show();return false"
value="#{messages.deleteLabel}"
title="#{messages.deleteHint}"
propagation="none"
reRender="systemPropertiesTable">
</a4j:commandLink>
<rich:modalPanel id="confirmation" width="210" height="100">
<f:facet name="header">#{messages.systemPropertyConfirmDialogHeader}
</f:facet>
<h:panelGrid>
<h:panelGrid columns="2">
<p><h:outputText value="#{messages.systemPropertyConfirmDialogContent}" /></p>
</h:panelGrid>
<h:panelGroup>
<input type="button" value="OK"
onclick="#{rich:component('confirmation')}.hide();submit();return false" />
<input type="button" value="Cancel"
onclick="#{rich:component('confirmation')}.hide();return false" />
</h:panelGroup>
</h:panelGrid>
</rich:modalPanel>
Did you try to transform the OK button into a a4j:commandButton and move the action on the OK button ?
You could save the "deleteValue" in your bean with an actionListener and effectively delete it if the user clicks "OK".

InputTextarea in Dialog shouldn't process but it does

I have an inputTextArea in a dialog and wanted that the bean property shouldn't be sent/changed when the user clicks on the cancel button, but it does.
<p:dialog header="Notizen" id="paketNotizenDialog" modal="true"
widgetVar="paketNotizenDialogWV">
<h:form>
<p:panelGrid columns="1">
<p:inputTextarea scrollHeight="200" rows="6" cols="33" autoResize="false"
value="#{paketErstellenDialogController.selectedPaket.notiz}" />
</p:panelGrid>
<p:commandButton value="Save" process="#form" oncomplete="PF('paketNotizenDialogWV').hide();"/>
<p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();" process="#none" update="#none" />
</h:form>
</p:dialog>
The button which opens the dialog:
<p:commandButton id="notizEintragButton" value="T" process="#this"
onclick="PF('paketNotizenDialogWV').show();" />
Any hints? Thanks in advance.
As you are using the commandButton, the default behaviour would be to submit the enclosing form with ajax request.
I suspect what you want to do here is to reset the form input and close the dialog. In that case you should go for the type="reset" which according to the primefaces doc:
Reset buttons do not submit the form, just resets the form contents.
And once that is done, trigger your closing javascript code:
<p:commandButton value="Cancel" type="reset"
onclick="PF('paketNotizenDialogWV').hide();"/>
If you do not want to reset the form, just close the dialog then use:
<p:commandButton value="Cancel" type="button"
onclick="PF('paketNotizenDialogWV').hide();"/>
Which according to the primefaces doc would:
Push buttons are used to execute custom javascript without causing an
ajax/non-ajax request. To create a push button set type as "button"
Update
If you want to reset the values from the backing bean then use reset input fields functionality of primefaces.
In your case it would be something like:
<p:panelGrid columns="1">
<p:inputTextarea id="input" scrollHeight="200" rows="6" cols="33" autoResize="false"
value="#{paketErstellenDialogController.selectedPaket.notiz}" />
</p:panelGrid>
<p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();"
process="#this" update="input" >
<p:resetInput target="input" />
</p:commandButton>
just add type="button" and remove process="#none" update="#none"
from <p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();" process="#none" update="#none" />

Update p:commandButton in p:column on complete of actionListener

I am trying to do a deactivation method, which will show the status ("DEACTIVATED","ACTIVATED") of the account on the commandbutton, and when i clicked on the commandButton, it will either activate or deactivate the account based on the current status. Once I confirm, the commandButton will be immediately updated to its current status.
I have the following code and I would like to update my commandButton after completion of my actionlistener in "confirmDeactivateDialog" or "confirmActivateDialog". I tried using update="a,b" at those two confirmDialog tag but it doesn't work. Any suggestions?
<p:column headerText="Status" style="text-align: center">
<p:commandButton id='a' rendered="#{bean.isActivated(account_status)==true}" oncomplete="PF('deactivateDialog').show();" value="Activated">
<f:setPropertyActionListener value="#{searchEmployeeResultList}" target="#{bean.selectedEmployee}"/>
</p:commandButton>
<p:confirmDialog id="confirmDeactivateDialog" header="Confirm Deactivation" widgetVar="deactivateDialog">
<p:commandButton id="Deactivate" value="Ok" oncomplete="PF('deactivateDialog').hide();" actionListener="#{AccountManagedBean.deactivate}"/>
</p:confirmDialog>
<p:commandButton id="b" rendered="#{bean.isActivated(account_status)==false}" oncomplete="PF('activateDialog').show();" value="Deactivate">
<f:setPropertyActionListener value="#{searchEmployeeResultList}" target="#{bean.selectedEmployee}"/>
</p:commandButton>
<p:confirmDialog id="confirmActivateDialog" header="Confirm Activation" widgetVar="activateDialog">
<p:commandButton id="Activate" value="Ok" oncomplete="PF('activateDialog').hide();" actionListener="#{AccountManagedBean.activate}"/>
</p:confirmDialog>
</p:column>
try
update="a b"
with no comma between them

display an input's value in dialog

I would like to display in a dialog the number inserted in the inputText.
<p:inputText id="nbr"
type="number"
value="#{MB.number}"
required="true"
label="nbr" />
<p:confirmDialog id="confirmPurchase"
message="Your Database was successfully created. And contains "
appendToBody="true"
header="Buy Emails List"
severity="info"
widgetVar="purchase">
<a class="boldtext">
#{MB.number}
<h5> datas</h5>
</a>
<p:commandButton id="confirm" value="Buy" actionListener="#{MB.buy())}" />
<p:commandButton id="decline"
value="Decline"
onclick="purchase.hide();"
type="button" />
</p:confirmDialog>
The code below returns always 0 as a number in the confirm dialog.
Update1
the dialog is showing once the action in the commandButton is completed
<p:commandButton value="Extract" update="table nbr" id="ajax" ajax="true" widgetVar="extractButton action="#{MB.search()}" oncomplete="purchase.show();"/>
First of all, you need a <h:form/> around your <p:inputText> and your <p:commandButton>.
Your <p:commandButton> should have the attribute update=":outputUserText".
Inside your Dialog, you need a <p:outputLabel id="outputUserText" value="#{MB.number}"

confirmDialog appears but disappears immediately

I have read similar questions on SA and the Primefaces forum but it did not help. Here is the xhtml:
<h:form id="form2" prependId="false">
<p:remoteCommand name="sendNameClicked" actionListener="#{reportBean.passName}"/>
<p:remoteCommand name="updateDialog" update=":form3:dialogBox"/>
<p:commandButton style="display: none" id="displayDialog" type="button" onclick="cd.show(); return false;"/>
</h:form>
<h:form id="form3">
<p:confirmDialog id ="dialogBox" message= "#{reportBean.getClickedAuthorLaius()}"
header="#{reportBean.nameClicked}#{reportBean.authorClicked.mostRecentAffiliation}"
widgetVar="cd"
severity="info"
>
<h:outputText styleClass="ui-widget" value="" escape="false" />
<p:commandButton value="Draw the ring of #{reportBean.obtainFullName()}?" actionListener ="#{controllerBean.prepareNewSearch()}" action ="index?faces-redirect=true" oncomplete="cd.hide();"/>
<p:commandButton value="No, stay on this page" onclick="cd.hide();" type="button" />
</p:confirmDialog>
</h:form>
Any help very much appreciated!
The onclick is fired before the form submit request is sent. The update is performed after form submit response is arrived. So, the confirm dialog is updated after it's been opened and thus get its default appearance again.
You need to open it after the update. Use the oncomplete attribute instead of onclick.
<p:commandButton ... oncomplete="cd.show()"/>

Resources