如何在 PrimeFaces 5.0 中使用 tabView 获取动态选项卡名称和数据？

Question

我需要动态显示选项卡名称。每个选项卡都会有自己的数据列表。例如如果选项卡名称是 "Student"，当用户单击 "Student" 选项卡时，它将显示学生列表。如果单击 "Teacher" 选项卡，将显示教师列表。我指的是使用以下 link 的 PrimeFaces 示例。 http://www.primefaces.org/showcase/ui/panel/tabView.xhtml

我尝试使用数据模型和 Ajax 事件示例，但我无法显示所需的数据。事件不适用于数据模型。

我试过以下方法，

<p:tabView value="#{myBean.tabList}" var="tabItem">
    <p:tab title="#{tabItem.tabTitle}">
        <h:outputText value="#{tabItem.valueA}"/>

    </p:tab>
</p:tabView>

如果我使用这种方法，数据是动态的，但不是我想要的方式。我的数据就像标签名称是一个列表，每个标签的数据是另一个列表。

TabView tabView = new TabView();
Tab newTab = new Tab();            
newTab.setTitle("Tab Title");  

Tab newTab2 = new Tab();            
newTab2.setTitle("Tab Title2");     
tabView.getChildren().add(newTab2);

有人能帮忙吗？

更新

我现在能够通过从支持 bean 创建 PrimeFaces 代码来根据需要显示动态数据。 TabView 在 <p:dialog> 框内。

out1 = new SelectBooleanCheckbox();
out1.setValue(obj.isTabViewCheckBox());
out2 = new HtmlOutputLabel();
out2.setValue(obj.getTaskName());

我遇到了新问题。提交后我无法获取 SelectBooleanCheckbox 值。 XHTML 代码：

<p:dialog header="#{BB.projNo}" widgetVar="addData" modal="true" showEffect="explode" hideEffect="explode" styleClass="editProjects">
<h:panelGrid id="TaskAdd">
    <f:facet name="header">
        <h:outputText value="Tasks"/>
    </f:facet>
    <p:tabView id="tabView" binding="#{BB.tabView}">
    </p:tabView>
</h:panelGrid>
<p:commandButton id="saveBtn" action="#{BB.addTask}" value="Save"  style="align:center;" styleClass="buttonStyle" onstart="showLoadImg();" oncomplete="hideLoadImg();PF('addData').hide();add();" >
</p:commandButton>
</p:dialog>

如何在提交时获取所选项目的价值？

Answer 1

你可以使用 jstl forEach 标签

<p:tabView id="myTabView">
    <c:forEach var="tab" items="#{myBean.tabs}">
                    <p:tab title="#{tab.title}">
                        <ui:include src="#{tab.url}" />
                    </p:tab>
                </c:forEach>
</p:tabView>

在你的 myBean 中 构建要迭代的列表

List<MyTabObject> tabs = new ArrayList<MyTabObject>();
tabs.add(new MyTabObject("Tab Title", "/path/to/contentFile.xhtml"));

MyTabObject

    public class MyTabObject {
        private String title;
        private String url;

        public MyTabObject() {

        }

        public MyTabObject(String title, String url) {
            this.title = title;
            this.url = url;
        }
     }

Answer 2

您还可以使用<p:tabView>的value属性来动态生成标签。

<p:tabView
   id="mytabView"
   value="#{bean.objectList}"
   var="item">

   <p:tab title="#{item.name}">
   ...content...
   </p:tab>
</p:tabView>

Answer 3

我找到了一种在提交后获取复选框值的方法。因为我有 2 个列表，一个用于选项卡名称，另一个用于选项卡数据，所以我不得不遍历这两个列表。

tabView.getChildren().get(index).getChildren().get(0).getChildren().get(indexTwo+1).getAttributes().get("value").toString();

我必须引用从最初用于生成复选框组件的 managedBean 生成的每个子元素。

如何在 PrimeFaces 5.0 中使用 tabView 获取动态选项卡名称和数据？

How to get dynamic tab names and data using tabView in PrimeFaces 5.0?

jsf

primefaces

jsf-2