PrimeFaces - Tree Example

[Updated: Jun 29, 2017, Created: Jun 24, 2017]

Following example shows how to use PrimeFaces's Tree component to display hierarchical data.

JSF page

src/main/webapp/index.xhtml

<h:form>
    <p:tree value="#{treeBean.animalNode}" var="node">
        <p:treeNode>
            <h:outputText value="#{node}"/>
        </p:treeNode>
    </p:tree>
</h:form>

The manage bean

@ManagedBean
@ViewScoped
public class TreeBean {
  private TreeNode animalNode;

  public TreeBean() {
      animalNode = new DefaultTreeNode("Animal", null);
      addNode(animalNode, "Reptiles", "Lizard", "Snake", "Turtle");
      addNode(animalNode, "Insets", "Ladybird", "Butterfly", "Bee");
      addNode(animalNode, "Fish", "Goldfish", "Shark", "Swordfish");
      addNode(animalNode, "Birds", "Parrot", "Sparrow", "Kingfisher");
      addNode(animalNode, "Mammals", "Deer", "Human", "Ape");
  }

  private void addNode(TreeNode parentNode, String nodeName, String... children) {
      TreeNode node = new DefaultTreeNode(nodeName, parentNode);
      node.setExpanded(true);
      if (children != null) {
          for (String child : children) {
              addNode(node, child, null);
          }
      }
  }

  public TreeNode getAnimalNode() {
      return animalNode;
  }
}

To try examples, run embedded tomcat (configured in pom.xml of example project below):

mvn tomcat7:run-war

Output


Example Project

Dependencies and Technologies Used :

  • primefaces 6.1 primefaces
  • jsf-api 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
  • jsf-impl 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
  • JDK 1.8
  • Maven 3.3.9

Tree Example Select All Download
  • simple-tree-example
    • src
      • main
        • java
          • com
            • logicbig
              • example
        • webapp

See Also