JSF reset button not resetting few columns

Question

I have the following in JSF page, when I press reset button, all values gets reset except for employeenumber(empnumber) and phone(phoneno), even autoComplete(empname) gets reset. What could be the reason for this?

    <p:panelGrid   columns="6"> 

    <h:outputLabel value="Employee Name"  />
    <p:autoComplete value="#{myMB.employee}"  id="empname"      
    completeMethod="#{myMB.complete}" converter="myConverter"
    var="p" itemLabel="#{p.employeeName}" itemValue="#{p}"               
    forceSelection="true" >                           
    <p:ajax event="itemSelect" listener="#{myMB.handleSelect}" 
    update ="empnumber phoneno" /> 
    <p:column>#{p.employeeName} - #{p.employeeNumber}</p:column>
    </p:autoComplete>   

   <p:message id="badgeMessage" for="empname" />                      

   <h:outputLabel  value="Employee Number"  />
   <p:inputText id="empnumber" value="#{myMB.employeeDetail.employeeNumber}" >
   </p:inputText>
   <p:message id="empnumMessage" for="empnumber" />

   <h:outputLabel value="Phone #" for="phoneno" />
   <p:inputText id="phoneno" value="#{myMB.employeeDetail.phoneNo}">
   </p:inputText>
   <p:message id="phoneMessage" for="phoneno" />

   </p:panelGrid>
   <p:separator />
  <p:panelGrid >
  <h:outputLabel value="Department" for="department" /> 
  <h:selectOneMenu id="department" value="#{myMB.department}"
  converter="departmentConverter"> 
  <f:selectItems value="#{myMB.departmentItems}" var="dept"
  itemLabel="#{dept.departmentName}" itemValue="#{dept.departmentCode}"/>
  <p:ajax listener="#{myMB.loadDepartments}" />
  </h:selectOneMenu>
 <p:message id="categoryMessage" for=  "department" />


 <p:commandButton type="reset" value="Cancel" icon="ui-icon-close"                     
 onclick="myDialog.hide()" />

Aren't you looking for this: http://stackoverflow.com/questions/10245215/reset-inputtext-in-primefaces ? Or something similar to this: http://stackoverflow.com/questions/12530469/how-to-clear-all-input-fields-in-pdatatable? — Balázs Németh, Mar 12 '13 at 08:49
@BalázsMáriaNémeth Those didn't resolve the issue. In fact I have added `RequestContext` as mentioned [here](http://www.primefaces.org/showcase-labs/ui/resetInput.jsf), however still all columns are not getting reset. — Jacob, Mar 12 '13 at 11:13
write an actionListener to reset the bean values and update the UI component. In your code I can see you are only hiding the dialog. — neni, Mar 12 '13 at 11:53

score 1 · Accepted Answer · answered Mar 12 '13 at 11:56

In case you are actually using Primefaces it makes sence to use its component <p:resetInput> that was specifically designed to handle data reset in case validation fails. As you can see from official documentation:

Input components keep their local values at state when validation fails. ResetInput is used to clear the cached values from state so that components retrieve their values from the backing bean model instead.

The component works as follows in case validation fails, values of components, whose ids are specified in target attribute of <p:resetInput>, are repopulated with initial values, when the tag is attached. <p:resetInput> can be attached to action source components like <p:commandButton>.

In order to simplify its usage, you can choose to group all your components that are to be reset in one container, like <p:panel id="panel">, as you can see from the showcase example.

In this light your view can be restructured as:

<h:form>
    <p:panel id="panel">
        <p:panelGrid   columns="6"> 
            <h:outputLabel value="Employee Name"  />
            <p:autoComplete value="#{myMB.employee}"  id="empname"      
                            completeMethod="#{myMB.complete}" converter="myConverter"
                            var="p" itemLabel="#{p.employeeName}" itemValue="#{p}"               
                            forceSelection="true" >                           
                <p:ajax event="itemSelect" listener="#{myMB.handleSelect}" 
                        update ="empnumber phoneno" /> 
                <p:column>#{p.employeeName} - #{p.employeeNumber}</p:column>
            </p:autoComplete>   
            <p:message id="badgeMessage" for="empname" />                      
            <h:outputLabel  value="Employee Number"  />
            <p:inputText id="empnumber" value="#{myMB.employeeDetail.employeeNumber}" >
            </p:inputText>
            <p:message id="empnumMessage" for="empnumber" />
            <h:outputLabel value="Phone #" for="phoneno" />
            <p:inputText id="phoneno" value="#{myMB.employeeDetail.phoneNo}">
            </p:inputText>
            <p:message id="phoneMessage" for="phoneno" />
        </p:panelGrid>
        <p:separator />
        <h:outputLabel value="Department" for="department" /> 
        <h:selectOneMenu id="department" value="#{myMB.department}"
                         converter="departmentConverter"> 
            <f:selectItems value="#{myMB.departmentItems}" var="dept"
                           itemLabel="#{dept.departmentName}" itemValue="#{dept.departmentCode}"/>
            <p:ajax listener="#{myMB.loadDepartments}" />
        </h:selectOneMenu>
        <p:message id="categoryMessage" for=  "department" />
    </p:panel>

    <p:commandButton value="Reset input values" update="panel" process="@this" onclick="myDialog.hide()" icon="ui-icon-close">
        <p:resetInput target="panel"/>
    </p:commandButton>
</h:form>

One doubt before I proceed, in any case I have reset bean values to null in order to use ` — Jacob, Mar 12 '13 at 12:19
You don't need to do anything. The `` tag will reset the components specified in `target` to the previous state, where the latter means the state that was saved in your backing bean upon last successful validation. If you want to do a full reset, reload the page. — skuntsel, Mar 12 '13 at 12:30

JSF reset button not resetting few columns

1 Answers1