Tabview can display dynamic number of tabs backed by a model. As tabs are generated on-the-fly it is easy
to implement adding/removing tabs as well.
 |
| Name: |
Messi |
| Number: |
10 |
| Position: |
CF |
|
 |
| Name: |
Iniesta |
| Number: |
8 |
| Position: |
CM |
|
 |
| Name: |
Villa |
| Number: |
7 |
| Position: |
CF |
|
 |
| Name: |
Xavi |
| Number: |
6 |
| Position: |
CM |
|
 |
| Name: |
Puyol |
| Number: |
5 |
| Position: |
CB |
|
Source
<p:tabView id="tabView" var="player" value="#{tabBean.players}">
<p:tab id="playerTab" title="#{player.name}">
<h:panelGrid columns="2" cellpadding="10">
<p:graphicImage id="playerImg" value="/images/barca/#{player.photo}" />
<h:panelGrid columns="2" cellpadding="10">
<h:outputText value="Name: " />
<h:outputText id="playerName" value="#{player.name}" style="font-weight: bold"/>
<h:outputText value="Number: " />
<h:outputText id="playerNumber" value="#{player.number}" style="font-weight: bold"/>
<h:outputText value="Position: " />
<h:outputText id="playerPosition" value="#{player.position}" style="font-weight: bold"/>
</h:panelGrid>
</h:panelGrid>
</p:tab>
</p:tabView>
package org.primefaces.examples.view;
import java.util.ArrayList;
import java.util.List;
import org.primefaces.examples.domain.Player;
public class TabBean {
private List<Player> players;
public TabBean() {
players = new ArrayList<Player>();
players.add(new Player("Messi", 10, "messi.jpg", "CF"));
players.add(new Player("Iniesta", 8, "iniesta.jpg", "CM"));
players.add(new Player("Villa", 7, "villa.jpg", "CF"));
players.add(new Player("Xavi", 6, "xavi.jpg", "CM"));
players.add(new Player("Puyol", 5, "puyol.jpg", "CB"));
}
public List<Player> getPlayers() {
return players;
}
}