0

我正在开发一个带有 JSF 2.0 和丰富面孔 4.2.3 的网络应用程序。我有一个页面,其中选项卡式面板相互嵌套,如下所示(代码在最后给出)。

我面临以下问题:

单击选项卡时,将触发验证并且不显示第二个选项卡(因为文本字段没有设置任何值,验证失败)。这是因为,当单击选项卡时,会触发 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>
4

1 回答 1

0

你已经在上面做了一件非常错误的事情,那就是嵌套<h:form/>s。表单嵌套在 HTML 和扩展 JSF 中都是非法的。即使您的观点没有其他问题,仅此构造就会在以后让您非常头疼。看到这个这个答案

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

于 2013-01-12T05:34:50.347 回答