I have buttons Stop and Release which call a save method and within the save method a confirmDialog is shown. I can use the Stop button, press OK in the dialog and the method works, but then when I go to clock Release again the button doesn't call the actionListener. Similar for clicking Release, confirming then trying to Stop.
Here are the two command buttons, which sit inside modeControls.
<p:commandButton title="Stop" value="Stop"
rendered="#{unitSetVehicleStatusBean.crudMode == 'READ' and unitSetVehicleStatusBean.stopped =='false'}"
actionListener="#{unitSetVehicleStatusBean.stop}"
update="modeControls :mainForm"
process="#this :mainForm"/>
<p:commandButton title="Release" value="Release"
rendered="#{unitSetVehicleStatusBean.crudMode == 'READ' and unitSetVehicleStatusBean.stopped =='true'}"
actionListener="#{unitSetVehicleStatusBean.release}"
update="modeControls :mainForm"
process="#this :mainForm"/>
Here is the confirmDialog. The save method it calls is called from within the stop() and release() methods, then after some validation I use
RequestContext context = RequestContext
.getCurrentInstance();
context.execute("PF('saveNDTDialog').show();");
break;
and when the user selects OK in the confirmDialog it will rejoin this method part way through a switch statement and complete the save.
Here is the confirmDialog.
<p:confirmDialog id="saveNDTDialog" appendTo="#(body)"
widgetVar="saveNDTDialog" closeOnEscape="true"
closable="true"
message="#{message.stoppedValidationNDTWarning}">
<p:commandButton value="OK"
update="mainForm :modeControls"
actionListener="#{unitSetVehicleStatusBean.save('WARNING_NDT')}"
oncomplete="saveNDTDlg.hide();"/>
<p:commandButton value="Cancel"
onclick="saveNDTDlg.hide();" />
</p:confirmDialog>
I believe the issue is something to do with the appendTo or possibly onComplete, but aren't too sure what's going wrong.
Any suggestions welcome...
By pulling the dialog out of the main form and adding a form around the commandButtons in the dialogs, the dialogs began working as expected.
Related
I have a situation in primefaces, where I have a button which on click calls a remote command through java script as a callback, this remote command is responsible to perform save action. I want to add confirmation to the Save button based on some controller value. So the expected output is on click if that value is true I want to show the confirmation dialog else I just want to do the normal save.
I am really new to primefaces. Any help would be highly appreciated.
<p:remoteCommand name="save" actionListener="#{controller.save()}" oncomplete="PF('statusDialog').hide()"/>
<p:button value="Save" styleClass="btn-primary btn-save" onclick="PF('statusDialog').show(); Modeler.saveBpmnToForm(save)" />
Whenever you trigger the remote command you could redirect the action to show the actual confirm dialog, then from there you can associate the action with the "confirm" button. The following logic is meant to show the dialog only if your boolean variable is true, otherwise you perform the save action without showing any dialog.
<p:remoteCommand name="save" actionListener="#{controller.status ?
controller.showDialog : controller.save}" oncomplete="PF('statusDialog').hide()"/>
Whenever this remoteCommand is triggered you'll show the following dialog using the bean:
<p:dialog id="confirmDialog" >
<p:button value="Confirm" styleClass="btn-primary btn-save"
onclick="PF('statusDialog').show()" action="#{controller.save}"/>
<p:button value="Cancel" styleClass="btn-primary btn-cancel"
onclick="PF('confirmDialog').hide()"/>
</p:dialog>
The "confirm" button will perform the actual logic, the "cancel" should only close the dialog but this is up to you.
I have a problem where I have a field with ValueChange ajax event and I have a saving ajax driven button. The problem happens when the user edits the field and then click over the saving button. The first click sends the ValueChange ajax request and updates the other fields, the second click saves the form. Here is a sample code
<pf:commandButton id="save" value="save" actionListener="#{car.save}">
<pf:ajax process="#form" update="#form" />
</pf:commandButton>
<pf:inputText id="price" value="#{car.price}">
<pf:ajax event="valueChange" process="#form" listener="#{car.calculatePrice}" update=":form:totalPrice"/>
</pf:inputText>
Is there a way to avoid this scenario ?. I guess one way is to make the saving button a non-ajax button. Is there another solution ? Thanks
The problem was somewhere in the project there is a <p:ajaxStatus> component that dims the whole website when you want to make #form update. Normally JSF has no problem with this.
In case you use <p:ajaxStatus> for your website and you faced the same problem. There is one solution for this, you can use the following code instead of the one mentioned in the question
<h:commandButton id="save" value="save">
<pf:ajax event="mousedown" process="#form" update="#form" listner="#{car.save}"/>
</h:commandButton>
here is my commandButton:
<p:commandButton value="Foo" update="panel1,panel2"
action="#{fooBean.add()}" />
method fooBean.add() is checking if object i want to add is not already in database - it return true - if it is already in base, false if it is not.
what i want to do is display a success message if fooBean.add() will return false after click on button.
It would be nice if that message would be like ConfirmDialog with OK option to close poped out window. Something like this:
http://www.primefaces.org/showcase/ui/confirmDialog.jsf
Any ideas how to help me?
If I understand you correctly you just want to display a dialog, so that the user acknowledges that the action succeeded. You could simply use a growl, but here is a solution using your approach.
.xhtml
<p:commandButton value="Foo" action="#{fooBean.add()}" />
<p:dialog widgetVar="dialog" modal="true">
<p:commandButton value="Ok" icon="ui-icon-close" oncomplete="dialog.hide()" />
</p:dialog>
fooBean
public void add() {
// do stuff
if(isInDB)
RequestContext.getCurrentInstance().execute("dialog.show()");
}
This opens the dialog after your item has already been found in the database. Nevertheless it may be more convenient for the user if he'd get a more subtle notification, without extra clicks.
I have a form inside a modal dialog and after closing (hiding in fact) one I wanted to reset all inputs that user might have changed. I though about something like as follow:
<p:dialog widgetVar="myDialog">
<h:form id="formId">
<!-- ... -->
<p:commandButton value="Cancel" onclick="myDialog.hide();"
update="formId">
<p:resetInput target="formId" />
</p:commandButton>
</h:form>
</p:dialog>
But the result was not that I expected. After a while of searching I found a solution that was to add process="#this" attribute to the <p:commandButton>. And my question is why it is necessary? What is really happening in backgroud that this process is desired. I don't really get the idea of process attribute at all.
I have done some work with dialog boxes and the way I did to make the form null is, when clicking the button to open dialog box, I ran a method in backing bean which cleared my pojo so my form had empty values.
In your case it could be something like this:
<h:form id="form-button">
<p:commandButton id="AddButton" value="open dialog box"
update=":form" action="#{myBean.myMethodToSetPojoNull}" immediate="true"
oncomplete="PF('myDialog').show()" />
</h:form>
When clicking this button, the called method will set to null all the fields and your dialog box will be empty. Getting back to your question of why process=#this is neccessary much better explained answer is here
What is the function of #this exactly?
You can also reset input after submitting through this method:
<p:commandButton value="Reset Non-Ajax"
actionListener="#{pprBean.reset}" immediate="true" ajax="false">
<p:resetInput target="panel" />
</p:commandButton>
If you don't add process="#this" then by default attribute value will be set to process="#form" which means all the elements in the form are processed. In command buttons process="#this" is mandatory to execute the corresponding actions associated with that button.
You can directly refer the answer from Balusc in this link
What is the function of #this exactly?
I have a dialog on one of my pages. It opens fine. It works fine if you use the button on the page, it closes. However, if you try and "x" out of the dialog it will not close. I believe it is related to the fact that I have an input field on the dialog, but I am not sure. I apologize if this is a dupe, I could not find a similar post.
<p:commandButton action="#{phoneListBean.debugger}"
value="Merge Unqiue" onclick="mdlg.show();"
update=":pmsg, :createNewPanel, :listform" />
<p:dialog id="mdialog" header="Merge Unqiue" widgetVar="mdlg"
appendToBody="true">
<h:form id="mform">
<h:panelGrid columns="2" cellpadding="5" id="m">
<h:outputLabel for="listName" value="Enter the List Name:" />
<p:inputText value="#{phoneListBean.mergeList.name}" id="listName" />
<p:commandButton action="#{phoneListBean.mergeUnique}"
value="Merge Unqiue" update=":pmsg, :listform"
onclick="mdlg.hide();" />
</h:panelGrid>
</h:form>
</p:dialog>
Thanks in advance for the help.
Your problem is that you don't want to use the onclick attribute with Primefaces buttons for displaying and hiding the dialogs. The click event may not get invoked before the postback because these buttons are not Ajax enabled.
Instead you should use oncomplete attribute. This will notify the Javascript event to execute only after the server postback has occurred, meaning that show() will display already updated dialog contents, and hide() will occur only after the server side execution has finished.