JSF 2验证以及richfaces中的选项卡式面板导致问题

时间:2013-01-10 14:10:15

标签: jsf-2 richfaces

我正在开发一个带有JSF 2.0和富人脸4.2.3的Web应用程序。 我有一个页面,其中标签面板彼此嵌套,如下所示(代码在最后给出)。

我正面临以下问题:

单击选项卡时,将触发验证并且不显示第二个选项卡(因为文本字段没有设置任何值,验证失败)。 这是因为,当单击选项卡时,将触发POST请求,从而导致调用验证。 我怎么能绕过这个?

其中一个选项可能是将switchType更改为“client”。但是,单击选项卡时,不会显示更新的数据。

<h:form>    
    <rich:tabPanel switchType="client">

        <rich:tab header="UserManagement">  
             <rich:tabPanel switchType="client">
                    <rich:tab header="AddUser">

                     <h:form>                       
                         <h:panelGrid id="addUserForm" columns="3">

                                Enter Name : 
                                <h:inputText id="name" value="#{userBean.name}"
                                    required="true" requiredMessage="User Id Required.">
                                </h:inputText>
                                <h:message for="name"></h:message>

                                Enter passWord : 
                                <h:inputText id="passWord" value="#{userBean.passWord}" required="true" requiredMessage="PassWord Required.">                    
                                </h:inputText>
                                <h:message for="passWord"></h:message>

                                Roles : 
                                 <h:selectOneMenu id="roles" value="#{userBean.roleId}">
                                                <f:selectItems  value="#{userBean.roles}"/>
                                </h:selectOneMenu>      
                                <h:message for="roles"></h:message>

                                <h:commandButton action="#{userBean.addUser}"
                                                    value="Add User">
                                      <f:ajax render="addUserForm" execute="@form"></f:ajax>
                                </h:commandButton>  
                        </h:panelGrid>
                    </h:form> 

                    </rich:tab>
                    <rich:tab header="EditUser"> 

                        <h:form>

                            <h:panelGrid id="editUserForm" columns="3">

                                    Enter passWord : 
                                    <h:inputText id="passWord" value="#{userBean.passWord}" required="true" requiredMessage="PassWord Required.">                    
                                    </h:inputText>
                                    <h:message for="passWord"></h:message>

                                    Roles : 
                                    <h:selectOneMenu id="roles" value="#{userBean.roleId}">
                                                    <f:selectItems  value="#{userBean.roles}"/>
                                    </h:selectOneMenu>      
                                    <h:message for="roles"></h:message>

                                    <h:commandButton action="#{userBean.editUser}"
                                                        value="Edit User">
                                          <f:ajax render="editUserForm" execute="@form"></f:ajax>
                                    </h:commandButton>
                            </h:panelGrid>  
                        </h:form>

                    </rich:tab>                          
             </rich:tabPanel>

        </rich:tab>     

        <rich:tab header="DeviceManagement">
        </rich:tab>     

    </rich:tabPanel>
</h:form>

1 个答案:

答案 0 :(得分:0)

你已经做了一件非常错误的事情,那就是嵌套<h:form/>。表单嵌套在HTML和扩展名JSF中都是非法的。即使你的观点没有其他任何错误,这个结构本身也会让你后来严重头痛。请参阅thisthis回答

选项卡点击时会触发验证,因为在一天结束时,所有组件都集中在同一个<h:form/>中。因此,该表单中的任何操作都将提交其中所有组件的全部内容。您必须摆脱最顶层的<h:form/>并相应地重组您的组件。此外,您可以使用<a4j:commandButton process="someId" ajaxSingle="true"/>选择性地处理视图组件,指定要提交以进行处理的组件的clientId