Hi everyone!
I wanted to test some ajax validation on a simple form. But I noticed some strange behaviour for the following code:
<f:view>
<rich:panel styleClass="pageMainpanel">
<f:facet name="header">
<ui:insert name="page.mainpanel.title">Panel-Titel</ui:insert>
</f:facet>
<h:form id="mainform">
<rich:togglePanel switchType="ajax" stateOrder="stage1, stage2">
<f:facet name="stage1">
<h:panelGrid>
<h:panelGrid columns="2" width="100px" columnClasses="formLabelClass, inputClass">
<h:outputLabel value="Vorname" />
<h:inputText value="#{customerBean.firstname}" id="firstname" required="true">
<f:validateLength minimum="3"/>
</h:inputText>
<h:outputLabel value="Nachname" />
<h:inputText value="#{customerBean.lastname}" id="lastname" required="true">
<f:validateLength minimum="3"/>
</h:inputText>
<rich:messages ajaxRendered="true"/>
</h:panelGrid>
<a4j:outputPanel styleClass="toggleControl" layout="block" >
<rich:toggleControl switchToState="#{'stage2'}" value="#{'stage2'}" />
</a4j:outputPanel>
</h:panelGrid>
</f:facet>
<f:facet name="stage2">
<h:panelGrid>
<h:outputText value="Stage 2" />
<a4j:outputPanel styleClass="toggleControl" layout="block" >
<rich:toggleControl switchToState="#{'stage1'}" value="#{'stage1'}" />
</a4j:outputPanel>
</h:panelGrid>
</f:facet>
</rich:togglePanel>
</h:form>
</rich:panel>
</f:view>
1) If I enter valid values the panel can be changed - fine!
2) If I enter invalid values nothing happens. The tab seems to notice the validation error, but renders no messages at all. From now on you cannot change tabs anymore - even with values that are ok.
Am I doing anything wrong?
Thanks in advance,
Oliver.
