I have two panels. First panel(panel-1) has a checkbox. When user checks/unchecks the checkbox, second panel(panel-2) will show/hide. There is one required input text field on panel-2.
Here is my code:
<rich:panel header="panel-1">
<a4j:region>
<tr:selectBooleanCheckbox value="#{bean.isAddingNewUser}" text="Add New User">
<a4j:support event="onclick" reRender="newUserPanel" limitToList="true" ajaxSingle="true"/>
</tr:selectBooleanCheckbox>
</a4j:region>
</rich:panel>
<a4j:outputPanel id="newUserPanel">
<rich:panel header="panel-2" rendered="#{bean.isAddingNewUser}">
<tr:inputText label="Name:" value="#{bean.name}" required="true"/>
</rich:panel>
</a4j:outputPanel>
<tr:panelButtonBar>
<tr:commandButton text="Save" action="#{controller.save}" blocking="true"/>
</tr:panelButtonBar>
The show/hide of panel-2 can be perfectly controled by the checkbox of panel-1.
The problem is:
If the initial value of "bean.isAddingNewUser" is FALSE, which causing the panel-2 is not rendered when the whole page is loaded at first time. Then bring up panel-2 by clicking the checkbox. Click "save" button without putting anything into the required field on panel-2. No validation warning shows up!! The form is fasely submitted with empty required field!!
If the initial value of "bean.isAddingNewUser" is TRUE, which causing panel-2 is rendered when the whole page is loaded, then it works as expecting.
Can anybody help me out on this?
