以编程方式折叠或展开p:accordionPanel

时间:2016-12-21 17:04:40

标签: primefaces jsf-2.2

我想要实现的目标是什么?

  • 单击加载按钮后,如果设置了任何一个文本字段,那么结果“手风琴面板”过滤器应该展开。

  • 点击加载按钮后,如果未设置所有文本字段,那么“手风琴面板”过滤器应该会崩溃。

我已经通过手风琴面板primefaces文档,但无法发现它有用。 http://www.primefaces.org/docs/vdl/3.5/primefaces-p/accordionPanel.html

我已经完成了之前在stackoverflow上提出的问题,这个问题的答案也无法让我满足我的要求。

Expanding Accordion Panel in PrimeFaces with a RadioButton click

ManagedBean


    package com.pk.test;

    import javax.faces.bean.ManagedBean;

    @ManagedBean(name="testBean")
    public class AccordionTestBean {

        private String name;

        private String semester;

        private String age;

        private Boolean checkNameTextField = false;

        public void save(){
            System.out.println("Close Filter If any one field of form is set");
            System.out.println("Name: "+getName());
            System.out.println("Age: "+getAge());
            System.out.println("Semester: "+getSemester());
            if(getName()!= null){
                setCheckNameTextField(true);
    //if name textfield is set to a value, on save click filter will not collapse or close
            }
            else
                setCheckNameTextField(false);
    //if name textfield is set to a value, on save click filter will collapse

        }

        public String getName() {
            return name;
        }

        public void setName(String name) {
            this.name = name;
        }

        public String getSemester() {
            return semester;
        }

        public void setSemester(String semester) {
            this.semester = semester;
        }

        public String getAge() {
            return age;
        }

        public void setAge(String age) {
            this.age = age;
        }

        public Boolean getCheckNameTextField() {
            return checkNameTextField;
        }

        public void setCheckNameTextField(Boolean checkNameTextField) {
            this.checkNameTextField = checkNameTextField;
        }
    }

FrontEnd文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:p="http://primefaces.org/ui">
<h:head>

</h:head>
<body>
    <h:form id="formId">
        <p:accordionPanel id="accordion" cache="false" activeIndex="-1"
            style="margin-bottom:20px;width:330px;" widgetVar="acc">
            <p:ajax event="tabClose" listener="#{testBean.checkNameTextField}" />

            <p:tab title="Filter:"
                titleStyle="width:330px;background-color:#DAEDF4">
                <h:panelGrid columns="2">
                    <h:outputLabel value="Name" />
                    <h:inputText value="#{testBean.name}" />

                    <h:outputLabel value="Age" />
                    <h:inputText value="#{testBean.age}" />

                    <h:outputLabel value="Semester" />
                    <h:inputText value="#{testBean.semester}" />

                </h:panelGrid>
                <p:commandButton icon="ui-icon-save" value="Save"
                    action="#{testBean.save}"
                    onclick="PF('formId:accordion').hide();" />
            </p:tab>
        </p:accordionPanel>
    </h:form>

</body>
</html>

1 个答案:

答案 0 :(得分:6)

我确实理解你要做的是什么,但是为了扩展/缩小手风琴面板,你可以使用这个

展开:PF('accordian-widgetVar').select(index)

崩溃:PF('accordian-widgetVar').unselect(index)

其中accordian-widgetVar是您的accordionPanel的属性widgetVar的值,index是您要展开/折叠的标签的索引

你也可以从像这样的bean执行它 RequestContext.getCurrentInstance().execute("PF('accordian-widgetVar').unselect(index)");