PrimeFaces TabView中固定和动态选项卡的组合 [英] Combination of fixed and dynamic tabs in PrimeFaces TabView

问题描述

是否可以在PF TabView中组合固定和动态选项卡?我的用例是为对象列表中的每个对象动态创建一个选项卡.固定的选项卡将包含用于创建新对象的表单.提交表单后，必须将具有新对象的新标签添加到TabView.

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.

我试图编写一个新的TabView Renderer，它将能够呈现动态和固定选项卡.但是，如果我将两种选项卡类型组合在一起，则PF命令按钮在固定选项卡上不起作用(我在此处发布了此问题: http://forum.primefaces.org/viewtopic.php?t=20840 ).

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).

我找到了一个论坛帖子，内容涉及在托管bean中创建PF选项卡( http://stackoverflow .com/questions/4052581/dynamic-generate-tabs-with-primefaces ).我希望尽可能避免在.jsf视图中声明性地使用PF组件.

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.

推荐答案

创建一个TabView，手动添加一个固定选项卡，然后使用<c:forEach>添加动态选项卡:

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;
}

结果:

这篇关于PrimeFaces TabView中固定和动态选项卡的组合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！