Combination of fixed and dynamic tabs in PrimeFace

2019-07-20 06:54发布

问题:

Is it possible to combine fixed and dynamic tabs in a PF TabView? My use case is creating a tab for each object in an object list dynamically. A fixed tab will hold a form for creating a new object. Once the form is submitted, a new tab with a new object must be added to the TabView.

So far I managed to implement this functionality only with two views - one for displaying objects dynamically and the other one with a form for a new object.

I tried to write a new TabView Renderer that would be able to render both dynamic and fixed tabs. However, if I combine two tab types, PF command button does not function on the fixed tab (I posted this problem here: http://forum.primefaces.org/viewtopic.php?t=20840).

I found a forum post about creating PF Tabs in a managed bean (http://stackoverflow.com/questions/4052581/dynamically-generate-tabs-with-primefaces). I'd like to avoid it if possible to be capable to use PF components declaratively in a .jsf view.

回答1:

Create a TabView, add one fixed tab manually and add the dynamic tabs using <c:forEach>:

<p:tabView>
    <p:tab title="Fixed tab">
        <h1>This is the fixed tab</h1>
    </p:tab>

    <c:forEach items="#{myBean.listItems}" var="item">
        <p:tab title="#{item.title}" closable="true">
            <h1>This is a dynamic tab</h1>
        </p:tab>
    </c:forEach>
</p:tabView>
public List<Item> getListItems() {
    Item item1 = new Item("Item 1 title");
    Item item2 = new Item("Item 2 title");
    Item item3 = new Item("Item 3 title");
    List<Item> listItem = new ArrayList<>();
    listItem.add(item1);
    listItem.add(item2);
    listItem.add(item3);
    return listItem;
}

Result:



回答2:

We had the same issue in our latest project and and solved it in a simple yet a little crude way:

We have created two (nested) tabviews. The top one includes 2 tabs. One showing all the dynamic tabs by having the nested second (dynamic) tabview. The second one showing the fixed tab. (In our case the fixed one does not create new tabs but shows a final result calculated from the dynamic tabs).

It is just a workaround but maybe it helps.