Question

这与richfaces 4.0

有关

我的网页上有两个下拉列表。在第一个DropDown上选择项目时，可以在网页上轻松呈现Second DropDown（之前不可见）。

在第二个下拉列表中选择项目时，我想渲染一个单独的面板（无法执行此操作）。

问题是我可以在从第一个下拉列表中选择项目后成功在网页上呈现第二个DropDown，但是当我选择第二个dropDown项目时，不会呈现任何面板。

我的代码如下：

 <rich:panel header="Select Operation" style="margin-top: 20px;  height: 110px">
            <h:panelGrid columns="1">
                <h:form>
                    <h:panelGrid columns="4">
                        <h:outputLabel value="Operation: " style="font-size: small; font-weight: 900"/>
                        <h:selectOneMenu style="margin-left: 10px; width: 150px" value="#{adminBean.currentType}">                                
                            <f:selectItem itemValue="0" itemLabel="" />
                            <f:selectItem itemValue="1" itemLabel="Add New User" />
                            <f:selectItem itemValue="2" itemLabel="Manage Balance" />
                            <f:selectItem itemValue="3" itemLabel="Manage Account" />
                            <a4j:ajax event="valueChange" render="second" execute="@this" />                                
                        </h:selectOneMenu>

                        <h:form>
                            <a4j:outputPanel id="second" layout="block">
                                <h:outputLabel value="Type : " style="margin-left: 130px; font-size: small; font-weight: bold;" rendered="#{not empty adminBean.currentType}"/>
                                <h:selectOneMenu style="margin-left: 10px; width: 150px" value="#{adminBean.currentItem}" rendered="#{not empty adminBean.currentType}">
                                    <f:selectItem itemValue="0" itemLabel="" />
                                    <f:selectItem itemValue="1" itemLabel="Participant" />
                                    <f:selectItem itemValue="2" itemLabel="Administrator" />
                                    <a4j:ajax event="valueChange"  render="rep"  execute="@this" />   
                                </h:selectOneMenu>

                            </a4j:outputPanel>                            
                        </h:form>
                    </h:panelGrid>
                </h:form>

            </h:panelGrid>

        </rich:panel>                

        <rich:panel style="margin-top: 20px; min-height: 500px">

            <a4j:outputPanel id="rep">

                <rich:panel rendered="#{not empty adminBean.currentItem}" header="Add Customer">

                    <h:panelGrid columns="2">
                        <a4j:commandButton value="Add New" style="width: 70px"></a4j:commandButton>
                        <a4j:commandButton value="Delete" style="margin-left: 10px; width: 70px"></a4j:commandButton>
                    </h:panelGrid>

                    </rich:panel>
                   </a4j:outputPanel>
            </rich:panel>

如上所述，我希望在从第二个选择项目时呈现id =“rep”。

Answer 1

你有两个问题：

您已嵌套导致HTML无效的表单。
您应该为您的组件提供ID。

这应该是修复的代码（注意我删除了所有不必要的属性，以使页面作为样式工作）：

<rich:panel id="pnlContainer">
    <h:panelGrid columns="1" id="grdSingleCol">
        <h:form id="frmData">
            <h:panelGrid columns="4" id="grdData">
                <h:selectOneMenu value="#{adminBean.currentType}">
                    <f:selectItem itemValue="0" itemLabel="" />
                    <f:selectItem itemValue="1" itemLabel="Add New User" />
                    <f:selectItem itemValue="2" itemLabel="Manage Balance" />
                    <f:selectItem itemValue="3" itemLabel="Manage Account" />
                    <a4j:ajax render="second" execute="@this" />
                </h:selectOneMenu>

                <a4j:outputPanel id="second" layout="block">
                    <h:selectOneMenu value="#{adminBean.currentItem}">
                        <f:selectItem itemValue="0" itemLabel="" />
                        <f:selectItem itemValue="1" itemLabel="Participant" />
                        <f:selectItem itemValue="2" itemLabel="Administrator" />
                        <!-- check how to render components outside the form -->
                        <a4j:ajax render=":pnlRepContainer:rep" execute="@this" />
                    </h:selectOneMenu>
                </a4j:outputPanel>
            </h:panelGrid>
        </h:form>
    </h:panelGrid>
</rich:panel>

<rich:panel id="pnlRepContainer">
    <a4j:outputPanel id="rep">
        <rich:panel rendered="#{not empty adminBean.currentItem}"
            header="Add Customer">
            <h:panelGrid columns="2">
                <a4j:commandButton value="Add New" />
                <a4j:commandButton value="Delete" />
            </h:panelGrid>
        </rich:panel>
    </a4j:outputPanel>
</rich:panel>

如何使用Richfaces中的ajax调用从DropDown（<h：selectonemenu>）加载a4j：outputPanel？</h：selectonemenu>

1 个答案: