Problem with rerendering input form
Environment:
richfaces-ui-3.3.2.SR1
Liferay-5.2.3
mojarra-1.2
Jboss-5.1.0
My use case:
I have a number of fields in a form to create, read, and update a database table. Some of these fields are 'required' and others are 'optional'. Initially, I want to display only the 'required' fields and let the User decide if he/she wants to enter data in the 'optional' fields too.
A checkbox component is provided if the User wishes to display the whole fields i.e., both the required and optional fields. When the User checks the checkbox, the form should 'immediatly' re-render the form, displaying all the fields; and when the User unchecks the checkbox, the form should 'immediately' re-render the form displaying only the required fields.
Please see part of the implementation code below. So far, the code is not stable: sometimes it works and other times it doesn't. I wonder if anyone has a suggestion or better way of implementing the above use case.
[Not Shown]
In the baking beans, how the ui components' 'render' value are re/set -- based on the value of the checkbox. This part of the code works fine.
Thanks in advance.
JSF:
:
<h:selectBooleanCheckbox id="documentSelectBooleanCheckbox"
binding="#{backing_newGenre.documentSelectBooleanCheckbox}"
value="#{backing_newGenre.formBean.allDocumentFields}"style="margin-right:2px">
<f:selectItem id="documentShowSelectItem" itemValue="false" itemLabel="#{genreMsg['label.optional.field.show']}" />
<f:selectItem id="documentHideSelectItem" itemValue="true" itemLabel="#{genreMsg['label.optional.field.hide']}" />
<!---
<a4j:support id="documentOptionalFieldsSupport"
event="onclick"
ajaxSingle="true"
ignoreDupResponses="true"
immediate="true"
limitToList="true"
actionListener="#{backing_newGenre.dataProfileOptionalFieldClicked}"
reRender="documentRegion"/>
-->
<a4j:support id="documentOptionalFieldsSupport2"
event="onchange"
ajaxSingle="true"
ignoreDupResponses="true"
immediate="true"
limitToList="true"
valueChangeListener="#{backing_newGenre.dataProfileOptionalFieldChange}"
reRender="documentRegion"/>
</h:selectBooleanCheckbox>
:
:
<a4j:region id="documentRegion"
ajaxRendered="true"
selfRendered="true">
<a4j:outputPanel id="documentOutputPanel"
layout="block" ajaxRendered="true">
<h:panelGrid id="documentPanelGrid"
binding="#{backing_newGenre.documentPanelGrid}"
columns="3"
columnClasses="cssFormFieldLabel, cssFormFieldInput, cssFormFieldMsg"
border="0">
<! THE FORM FIELDS LABEL/INPUT BOX GOES HERE -->
:
:
:
<h:panelGrid>
</a4j:outputPanel>
</a4j:region>
:
JSF Backing bean:
/*
* Method to set or reset optional fields to render
* @param event
*/
public void dataProfileOptionalFieldChange(javax.faces.event.ValueChangeEvent event){
dataProfileToggleFields = ! dataProfileToggleFields;
getSessionBean().setAttribute("dataProfileToggleFields", new Boolean(dataProfileToggleFields));
}
public void dataProfileOptionalFieldClicked(javax.faces.event.ActionEvent actionEvent){
dataProfileToggleFields = ! dataProfileToggleFields;
getSessionBean().setAttribute("dataProfileToggleFields", new Boolean(dataProfileToggleFields));
}
