You can use <p:tabView>to display dynamic tabs based on some beans collection. You can present the βAddβ tab as the last tab of the tab. You can, if necessary, in a different way. You can use <p:ajax event="tabChange">to connect a tab change listener, in which you can check if the "Add" tab has been opened, and then add a new tab.
eg.
<h:form id="form">
<p:tabView id="tabs" value="#{bean.tabs}" var="tab" widgetVar="w_tabs">
<p:ajax event="tabChange" listener="#{bean.changeTab}" oncomplete="if (args.newTabIndex) w_tabs.select(args.newTabIndex)" />
<p:tab title="#{tab.title}">
<p>#{tab.content}</p>
</p:tab>
</p:tabView>
</h:form>
with
@ManagedBean
@ViewScoped
public class Bean implements Serializable {
private List<Tab> tabs;
@PostConstruct
public void init() {
tabs = new ArrayList<Tab>();
tabs.add(new Tab("tab1", "content1"));
tabs.add(new Tab("tab2", "content2"));
tabs.add(new Tab("Add...", null));
}
public void changeTab(TabChangeEvent event) {
int currentTabIndex = ((TabView) event.getComponent()).getActiveIndex();
int lastTabIndex = tabs.size() - 1;
if (currentTabIndex == lastTabIndex) {
tabs.add(lastTabIndex, new Tab("tab" + tabs.size(), "content" + tabs.size()));
RequestContext requestContext = RequestContext.getCurrentInstance();
requestContext.update("form:tabs");
requestContext.addCallbackParam("newTabIndex", lastTabIndex);
}
}
public List<Tab> getTabs() {
return tabs;
}
}
The class Tabin this example is a simple javabean with titleand properties content. oncompletein <p:ajax>necessary, because the contents of the tab would otherwise disappear after adding a new tab (which is pretty much like a PF error, after all, I used 3.3).
source