java - AF :panelAccordion partialtrigger on af:selectOneChoice valueChangeListener

Question

我是 ADF faces 的新手，在 af:selectOneChoice 的值更改上部分触发 af:panelAccordion 时遇到麻烦。 af:panelAccordion 在其 af:showDetailItem 中包含多个 af:showDetailHeader。所有 af:showDetailItem 及其 af:showDetailHeader 都是动态生成的。Bean College在 View 范围内，其代码如下:

public class College {
    private List<Department> departments;
    private List<SelectItem> departmentDropDownMenu;
    private String selectedDepartment;

    public College() {
        this.departments = new ArrayList<Department>(0);

        Employee employee1 = new Employee("Employee 1", "Information");
        Employee employee2 = new Employee("Employee 2", "Information");
        Employee employee3 = new Employee("Employee 3", "Information");
        Employee employee4 = new Employee("Employee 4", "Information");
        Employee employee5 = new Employee("Employee 5", "Information");

        List<Employee> employees1 = new ArrayList<Employee>(0);
        employees1.add(employee1);

        List<Employee> employees2 = new ArrayList<Employee>(0);
        employees2.add(employee2);

        List<Employee> employees3 = new ArrayList<Employee>(0);
        employees3.add(employee3);

        List<Employee> employees4 = new ArrayList<Employee>(0);
        employees4.add(employee4);
        employees4.add(employee5);

        Department department1 = new Department("Department 1", employees1);
        Department department2 = new Department("Department 2", employees2);
        Department department3 = new Department("Department 3", employees3);
        Department department4 = new Department("Department 4", employees4);

        this.departments.add(department1);
        this.departments.add(department2);
        this.departments.add(department3);
        this.departments.add(department4);

        List<SelectItem> departmentDropDownMenu = new ArrayList<SelectItem>(0);
        departmentDropDownMenu.add(new SelectItem("Department 1"));
        departmentDropDownMenu.add(new SelectItem("Department 2"));
        departmentDropDownMenu.add(new SelectItem("Department 3"));
        departmentDropDownMenu.add(new SelectItem("Department 4"));

        this.setDepartmentDropDownMenu(departmentDropDownMenu);
        this.setSelectedDepartment("Department 1");
    }

    public void departmentDropDrownValueChangeListener(ValueChangeEvent event) {
        String oldValue = event.getOldValue().toString();
        String newValue = event.getNewValue().toString();

        if(oldValue.equalsIgnoreCase(newValue)) {
            return;
        }
        List<Department> departmentUpdated = new ArrayList<Department>(0);

        for (Department department : departments) {
            if(department.getDepartmentName().equals(newValue)) {
                departmentUpdated.add(department);
                break;
            }
        }

        for (Department department : departments) {
            if(!department.getDepartmentName().equals(newValue)) {
                departmentUpdated.add(department);                
            }
        }

        this.setDepartments(departmentUpdated);
    }

    public void setDepartments(List<Department> departments) {
        this.departments = departments;
    }

    public List<Department> getDepartments() {
        return departments;
    }

    public void setDepartmentDropDownMenu(List<SelectItem> departmentDropDownMenu) {
        this.departmentDropDownMenu = departmentDropDownMenu;
    }

    public List<SelectItem> getDepartmentDropDownMenu() {
        return departmentDropDownMenu;
    }

    public void setSelectedDepartment(String selectedDepartment) {
        this.selectedDepartment = selectedDepartment;
    }

    public String getSelectedDepartment() {
        return selectedDepartment;
    }
}

Department 和 Employee 类是简单的 POJO。 Department 类仅包含两个字段:1. 字符串部门名称和2.列出员工名单Employee 类及其访问器也包含两个字段:1. 字符串名称和2. 字符串信息。

页面的jspx代码如下:

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
    <jsp:directive.page contentType="text/html;charset=UTF-8"/>
    <f:view>
        <af:document title="Page.jspx" id="d1">
            <af:form id="f1">
                <af:panelStretchLayout id="psl1">
                    <f:facet name="center">
                        <af:panelGroupLayout id="pgl2">
                            <af:selectOneChoice label="Department" value="#{college.selectedDepartment}" id="soc1"
                                                unselectedLabel="" autoSubmit="true" immediate="true"
                                                valueChangeListener="#{college.departmentDropDrownValueChangeListener}">
                                <f:selectItems value="#{college.departmentDropDownMenu}" id="si1"/>
                            </af:selectOneChoice>
                            <af:panelAccordion id="pa1" discloseNone="true" partialTriggers="soc1" discloseMany="true">
                                <af:forEach items="#{college.departments}" var="department">
                                    <af:showDetailItem text="#{department.departmentName}" id="sdi1">
                                        <af:forEach items="#{department.employees}" var="employee">
                                            <af:showDetailHeader text="#{employee.name}" disclosed="false" id="sdh1">
                                                <af:outputText value="#{employee.info}" id="ot1"/>
                                            </af:showDetailHeader>
                                        </af:forEach>
                                    </af:showDetailItem>
                                </af:forEach>
                            </af:panelAccordion>
                        </af:panelGroupLayout>
                    </f:facet>
                </af:panelStretchLayout>
            </af:form>
        </af:document>
    </f:view>
</jsp:root>

我想要做的是根据 af:selectOneChoice 的选定值重新排列 af:showDetailItem。

我在图像中显示了问题:

正如您所看到的，第一张图片是页面加载后的正常情况。部门 1 只有一名员工，即员工 1 和部门 4 有两名员工员工 1、员工 2。从下拉列表中选择部门 4 后，部门 3 进入最后一个位置，但在部门 3 面板中显然有两个 af:showDetailItem 在图片中，但最初它只有一名员工。另外，额外的 af:showDetailItem 不可点击。

如果有人请提出任何建议，这对我很有帮助。

谢谢。

Answer 1

问题出在使用<af:forEach/> 。根据tag documentation :

Objects in the items of an <af:forEach> tag should not be added, removed or re-ordered once the component tree has been created

您可以使用 <af:iterator/>标签代替。 JDev 会提示它不是 <af:panelAccordion/> 的有效子级。 ，但它确实有效。

这个页面布局似乎有效。注意，我移动了<af:selectOneChoice/>到顶面并倾倒 <af:panelGroupLayout/>强制 Accordion 拉伸(stretch)并使所有 child 都可见。

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
    <jsp:directive.page contentType="text/html;charset=UTF-8"/>
    <f:view>
        <af:document title="Page.jspx" id="d1">
            <af:form id="f1">
                <af:panelStretchLayout id="psl1">
                    <f:facet name="center">
                            <af:panelAccordion id="pa1" discloseNone="false" partialTriggers="soc1" discloseMany="true" reorder="enable">
                                <af:iterator value="#{college.departments}" var="department">
                                    <af:showDetailItem text="#{department.departmentName}" id="sdi1">
                                        <af:iterator value="#{department.employees}" var="employee">
                                            <af:showDetailHeader text="#{employee.name}" disclosed="false" id="sdh1">
                                                <af:outputText value="#{employee.info}" id="ot1"/>
                                            </af:showDetailHeader>
                                        </af:iterator>
                                    </af:showDetailItem>
                                </af:iterator>
                            </af:panelAccordion>    
                    </f:facet>
                    <f:facet name="top">
                        <af:selectOneChoice label="Department" value="#{college.selectedDepartment}" id="soc1" unselectedLabel="" autoSubmit="true"
                                            valueChangeListener="#{college.departmentDropDrownValueChangeListener}" immediate="true">
                            <f:selectItems value="#{college.departmentDropDownMenu}" id="si1"/>
                        </af:selectOneChoice>
                    </f:facet>
                </af:panelStretchLayout>
            </af:form>
        </af:document>
    </f:view>
</jsp:root>

希望这有帮助。欢迎 ADF 的困惑。 :)