动态更新两个 JSF PrimeFaces Listboxes

Question

我正在 Netbeans 上使用 JSF Primeface 创建一个 Web 应用程序。我想要做的是动态更新两个 selectOneListBox 项目。更具体地说，我想根据我在第一个列表框上单击的值更新第二个列表框上的值。

例如：我有两个数据库，活动和子活动，我想将它们显示在单独的列表框中。活动可以有“音乐、运动、户外、室内等”。我想在第一个列表框中显示这些值。当我单击其中一个时，我想获取与特定活动关联的子活动。因此，在子类别数据库中，有一个子活动列表，每个子活动都有一个与活动数据库中的成员相关联的唯一标识符。当我单击活动列表框上的条目时，我想拉出特定的子活动并将它们显示在第二个列表框上。

我能够从活动数据库中获取值并将它们显示在第一个列表框上：

<p:selectOneListbox value="#{activityController.itemsAvailableSelectOne}">
    <f:selectItems value="#{activityController.items}" var="item"
        itemValue="#{item}" itemLabel="#{item.activityName}"/>
</p:selectOneListbox>

我将如何实现第二个列表框？

Answer 1

你可以试试这个：

你的第一个 selectOneListbox：

<h:form>
<p:selectOneListbox value="#{activityController.itemsAvailableSelectOne}" id="listBox1">
   <f:selectItems value="#{activityController.items}" var="item"
    itemValue="#{item}" itemLabel="#{item.activityName}"/>
   <p:ajax listener="#{activityController.itemChange}"
                            update="listBox2" />
</p:selectOneListbox>

第二：

<p:selectOneListbox value="#{activityController.subItem}" id="listBox2">
   <f:selectItems value="#{activityController.subItems}" var="item"
    itemValue="#{item}" itemLabel="#{item.activityName}"/>       
</p:selectOneListbox>

支持 Bean：

public void itemChange() {
 // load stuff based on selected item
}