Question

我需要在表单上进行一些基本验证。表单数据在5个选项卡中分解，用户应该能够从任何选项卡提交表单。到现在为止还挺好。如果用户尚未填写字段，或者输入了无效数据，我希望保留在当前选项卡上，则显示错误消息并取消选项卡切换。

我尝试过我能找到的各种活动。有没有人知道这是否可能以及我如何实现它？如果可能的话，我宁愿在javascript中将它保留在客户端。

使用下面的代码示例。

<rich:tabPanel selectedTab="Info" switchType="client" contentClass="hz-record-tabpanel" ontabchange="doTabChange();"  onbeforeitemchange="doTabChange();" onbeforetabchange="doTabChange();">
                <rich:tab name="Info" label="Tab Label" onlabelclick="doTabChange();">
                    <ui:include src="info.xhtml" />
                </rich:tab>
                <rich:tab name="Officers" label="Officers" onlabelclick="doTabChange();" ontableave="doTabChange();">
                    <ui:include src="officers.xhtml" />
                </rich:tab>
                <rich:tab name="CardServices" label="Card Services" onlabelclick="doTabChange();">
                    <ui:include src="cardservices.xhtml" />
                </rich:tab> 
                <rich:tab name="M2MLimits" label="M2M Limits" onlabelclick="doTabChange();">
                    <ui:include src="m2mlimits.xhtml" />
                </rich:tab> 
                <rich:tab name="AccountServices" label="Account Services" onlabelclick="doTabChange();">
                    <ui:include src="accountservices.xhtml" />
                </rich:tab>                 
            </rich:tabPanel>

任何想法？

Answer 1

这是我用来在经过良好验证后关闭rich：modalPanel的按钮：

<a4j:commandButton id="btnModify" value="Modifier" actionListener="#{editCityActions.onButtonModifyClick}" data="#{facesContext.maximumSeverity.ordinal ge 2}" oncomplete="if(event.data == false) { #{rich:component('frmEditCity')}.hide(); }" render="tblCities" />

我认为您可以使用a4j：ajax或类似的东西来应用事件！

Answer 2

我们最终转移到Richfaces 4（4.2）并成功使用itemchange和beforeitemchange

事件。

这些事件发生了两次（还没有想出那个事件）所以你不需要处理程序代码中任何过于密集的事情。

如果beforeitemchange返回false（两次），则tabpanel将不会切换。

我正在使用itemchange事件触发任何额外的javascript来格式化数据，并将焦点放在该标签上表单中的第一个输入字段。

如何在RichFaces 3.3.x中取消选项卡面板切换

2 个答案: