Primefaces commandButton not working properly

Question

I want, when i press the commandButton, to refresh my page (all inputText boxes, all checkBoxes to be empty, as if the page is reloaded. I tried with update="@requestForm", update=":requestForm", update="@all" ajax="false", update="@([id$=requestForm])", but no success...

This is the code for my commandButton:

  <h:commandButton value="Save" id="saveBtn"
                        actionListener="#{requestBean.addRequest()}" ajax="false" />

My form has id = "requestForm". Any ideas?

Answer 1

There are many ways to achieve it.

1. You can make your managed bean request scoped .
2. You can set the values to null in the backing bean , after submit.
3. You can use resetValues (set to true ) attribute of the p:ajax component.
4. You can use the p:resetInput component inside your p:commandButton
5. You can use the method RequestContext.getCurrentInstance().reset("reference to the component to reset") in your backing bean.

There are examples of these methods on Primefaces - ShowCase, search for ResetInput under Misc.

Answer 2

In case of JSF when we enter some text in input filed and that input filed is mapped with back bean, then the UI-Page is showing the current value of backing bean value on UI-Page.

Example : if you have field firstName in java class and you are setting the name by <p:inputText /> and click on button Save the value is live until object live. so you have to provide null value in firstName after clicking save button in method of actionListener="#{requestBean.addRequest()}" . And use update="@form". if both is not work then you have to write JavaScripts for that. if not work let me know.

Answer 3

I don't think primefaces update works with #id selector, please try with style class :

<h:form styleClass="form-selector"> 

<p:commandButton update="@(.form-selector)" />

Answer 4

Try these;

<p:commandButton  value="Clear" process="@this" type="reset" update="requestForm">
                 <p:resetInput target="requestForm"/>
 </p:commandButton> 

If it is an object, you need to set it to null and add ajax listener with update;

resetForm(){obj=null;}

Then;

<p:ajax event="change" update="requestForm" listener="${resetForm()}"/>

Answer 5

This is how I had to do it - who knows why:

      <p:commandButton value="Reset" icon="ui-icon-refresh" process="@this" update=":form">
        <p:resetInput target=":form" clearModel="true" />
      </p:commandButton>

Depending on your needs, clearModel may not be necessary. See the PrimeFaces documentation on resetInput's clearModel (defaults to false): "When enabled, reset input also sets null values to the bound values so it reset inputs values and model values."

As someone tells us here :

Just in case someone else has this same problem...

p:resetInput does NOT accept @form as a target. You must supply the actual ID of the form/naming container that you would like to clear. I have seen examples of code online (I think somewhere on StackOverflow) that used @form as the target-- don't be fooled, this does not work.

This is why I used target=":form" , because my root NamingContainer was <h:form id="form"> . There's loads of information on the NamingContainers selection stuff here .

Also, note that you can do this to have a confirm dialog first:

      <p:commandButton value="Reset" icon="ui-icon-refresh" process="@this" update=":form">
        <p:resetInput target=":form" clearModel="true" />
        <p:confirm header="Confirm Reset" message="Are you sure you want to reset all changes?" icon="ui-icon-help" />
      </p:commandButton>

      <p:confirmDialog global="true" closable="true" closeOnEscape="true" showEffect="fade" hideEffect="fade">
        <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"  />
        <p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
      </p:confirmDialog>