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>
Related
<p:commandButton id="excelAccountLevelOneAccLvl1" ajax="false" icon = "fa fa-fw fa-download" >
<f:param name="accountLevelOneFormRequest" value="accountLevelOneFormRequest" />
<p:dataExporter type="xlsx" target="baselineOneTable"
fileName="#{exportToExcelPageBean.fileName}"
postProcessor="#{exportToExcelPageBean.postProcessXLS}" />
</p:commandButton>
On clicking this button, somehow the forms seems to update and it activates the Faces validation and asks me to fill enter the mandatory field values! I can't figure out why! There is not update parameter here at all!
update is for ajax requests only. You are using ajax="false" which means the commandButton activates a
full page request. That in turn means that the whole form in which the commandButton is included is
processed. If you want to avoid this put your commandButton in a separate form.
I'm working with JSF and PrimeFaces, and I can't handle the following situation:
I have a dialog, and I placed a dataTable on it. In one of the cells of the table I would like to display given data in 3 different ways, and I'd like to switch between them. So far I managed to switch between these rendering types via commandLink, but my problem is that when I click on one of the 3 links, the dialog closes! Can I update the content of the dialog, and be able to keep it open the same time? (I'm updating which render type to use via myMethod)
my commandLink looks like this:
<p:commandLink id="id" update=":myForm:myDialog" ajax="false"
action="#{myBean.myMethod}" oncomplete="dialog.show()">
If i don't use the ajax=false attribute, the method is not called, and I also tried imediate=true, but that's not it either.
You need to define an p:outputPanel inside your dialog and update the outputpanel, not the dialog itself (that's why your dialog closes):
<p:dialog id="myDialog" ...>
<p:outputPanel id="myOutputPanel">
... your dialog content goes here
</p>
</p:dialog>
and change your commandlink
<p:commandLink id="id" update=":myForm:myDialog:myOutputPanel" ajax="true"
action="#{myBean.myMethod}" oncomplete="dialog.show()">
Regarding the oncomplete="dialog.show()" - I'm not entirely sure if you need that. A precise answer can be given if you provide more code regarding your table and code.
I had the same problem, and solution is to update a form instead of dialog. For example:
<p:dialog id="id_dialog" ...>
<h:form id="id_form">
... content
</h>
</p:dialog>
and commandLink:
<p:commandLink update=":id_form" process="#all" ...>
This worked for me!
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'am facing a strange situation were I have a commandButton (I have tried both standard h:commandButton and primefaces one p:commandButton), when the button is clicked a method in the backing bean is invoked and an Excel file is returned.This command button is inside a dialog, however I think this shouldn't affect.
Problem is that it seems that this button isn't generating any request, at least firebug doesn't show it, but I get the Excel file from the server, which doesn't make sense if there were no requests.
<h:commandButton id="downloadButton" value="Download" action="#{bean.downloadExcel}"/>
<p:commandButton id="downloadButton" value="Download" action="#{bean.downloadExcel}" ajax="false" onsuccess="confirmDialogWv.close();"/>
I don't use both buttons at the same time, just tested with both of them with same result.
What is the problem if "everything is working fine"? I can't close the dialog with an onsuccess event if I don't have any request.
Has someone faced this problem before? Any explanation?
Thanks in advance for your help!
EDIT:
<h:form id="contentForm" prependId="false" >
<!-- lot of code -->
<p:dialog id="confirmDialog"
modal="true"
closable="false"
widgetVar="confirmDialogWv"
resizable="false"
header="Confirm">
<p:commandButton id="downloadButton" value="Download" action="#{bean.downloadExcel}" ajax="false" onsuccess="confirmDialogWv.close();"/>
<p:commandButton id="openHtmlButton" value="Open HTML" process="#form" update="#form" actionListener="#{bean.openHtml}"/>
</p:dialog>
</h:form>
The second button opens a new window and works properly.
UPDATE:
As already said firebug doesn't show any request, but I've been testing now with IE and Chrome.
Chrome: Shows the request, but when I get the Excel file in the browser the status of the request becomes "canceled".
IE9: Shows the request and returns code 200, but the onsuccess event isn't triggered
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.