Dynamically Generate Tabs with PrimeFaces

Question

Hi I would like to iterate over a list of person-object and show the data in a tab per person. I tried:

<p:tabView>
<ui:repeat ...>
   <p:tab title="#{expression}>
</ui:repeat>
</p:tabView>

This is not working. Any help appreciated

Marcel

Answer 1

PrimeFaces 3.x's tabView now supports a dynamic number of tabs with the addition of its own iteration feature:

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

Unfortunately, it's still not possible to include both fixed and dynamic tabs in the same tabView (as I wanted to do), or even dynamically add a tab without rebuilding the view. Fortunately, doing the latter isn't a big deal when using a SessionScoped or CDI ConversationScoped bean (or perhaps a JSF ViewScoped bean as well).

Answer 2

I would binding the tabView to server back bean

<p:tabView binding="#{homeController.tabView}">

</p:tabView>

---

public class HomeController {

    private TabView tabView;

    public TabView getTabView(){ 
           return tabView;
    }
    public void setTabView(TabView tabView){ 
           this.tabView = tabView;
    }

    public HomeController(){
         //generate tabs by code
         tabView = new TabView();
         Tab tab1 = new Tab();
    tab1.setTitle("Business Partner");
    Tab tab2 = new Tab();
         tab2.setTitle("Manage Favorites");
    tabView.getChildren().add(tab1);
    tabView.getChildren().add(tab2);
    }
}

Hope it helps, but now I'm still looking how to define the Tab Content by code.