PrimeFaces Tree component, setting selected node from managed bean

Question

I'm running Primefaces 3.2 and JSF 2.0 on Glassfish 3.

I've tried a lot, to programatically set the selected node from a managed bean. That includes setting the selected node like this:

public void setSelectedTreeNode(String name) {
TreeNode root = treeBean.getRoot();
List<TreeNode> tree = root.getChildren();
for(TreeNode node:tree) {
  if(node.getData().toString().contains(name)) {
    System.out.println("found the node to select");
    treeBean.setSelectedNode(node);
    break;
  }
}
RequestContext context = RequestContext.getCurrentInstance(); 
context.update(":navForm:treeSingle");
}

The "found the node to select" gets printed in the terminal, but the node is not selected in the Tree in the web page..

The tree is like this:

<h:form id="navForm">
<p:tree id="treeSingle" value="#{treeBean.root}" var="node"  
       selectionMode="single" styleClass="treeStyle" 
       selection="#{treeBean.selectedNode}"
       cache="false"
       >  
   <p:ajax event="select" listener="#{treeBean.onNodeSelect}" update=":mainForm" />
   <p:treeNode>  
       <h:outputText value="#{node}" escape="false" />  
   </p:treeNode>  

Edit: TreeBean is built like this:

@ManagedBean
@SessionScoped    
public class TreeBean implements Serializable {  

private TreeNode root;  

private TreeNode selectedNode;  

public TreeBean() {  
    root = new DefaultTreeNode("Root", null);  
    TreeNode node0 = new DefaultTreeNode("Node 0", root);  
    TreeNode node1 = new DefaultTreeNode("Node 1", root);  
    TreeNode node2 = new DefaultTreeNode("Node 2", root);  

    TreeNode node00 = new DefaultTreeNode("Node 0.0", node0);  
    TreeNode node01 = new DefaultTreeNode("Node 0.1", node0);  

    TreeNode node10 = new DefaultTreeNode("Node 1.0", node1);  
    TreeNode node11 = new DefaultTreeNode("Node 1.1", node1);  

    TreeNode node000 = new DefaultTreeNode("Node 0.0.0", node00);  
    TreeNode node001 = new DefaultTreeNode("Node 0.0.1", node00);  
    TreeNode node010 = new DefaultTreeNode("Node 0.1.0", node01);  

    TreeNode node100 = new DefaultTreeNode("Node 1.0.0", node10);  
}  

public TreeNode getRoot() {  
    return root;  
}  

public TreeNode getSelectedNode() {  
    return selectedNode;  
}  

public void setSelectedNode(TreeNode selectedNode) {  
    this.selectedNode = selectedNode;  
}  
}

Does anyone have any idea on how to do this?

Answer 1

I solved it using:

node.setSelected(true);

I discovered that selecting the node is not enough for the "tree component" to expand from root node to selected node.

For this, I used the following approach. On the view :

 <p:ajax event="expand" listener="#{tree.onExpand}"/>

on the java code:

public void onExpand(NodeExpandEvent event) {
    expand(event.getTreeNode());
}

private void expand(TreeNode treeNode){
    if (treeNode.getParent()!=null){
        treeNode.getParent().setExpanded(true);
        expand(treeNode.getParent());
    }
}

Answer 2

To highlight selected tree node on client side from backing bean call selectNode() method on tree widget component.

First, set widget var attribute to jsf tree component:

<p:tree id="treeSingle" widgetVar="treeSingleWidget"

Than you can test it from browser console:

PrimeFaces.widgets.treeSingleWidget.selectNode($("#treeSingle\\:1"), true);

First method argument represents node jquery object which was obtained by it`s id(colon symbol must be escaped by two backslashes). If second parameter set to false then node selection event will be fired.

Finally, make javascript call from backing bean:

StringBuilder sb = new StringBuilder();
    sb.append("PrimeFaces.widgets.treeSingleWidget.selectNode(");
    sb.append("$(\"#treeSingle\\\\:");
    sb.append(selectedNode.getRowKey());
    sb.append("\")");
    sb.append(", true)");
    RequestContext.getCurrentInstance().execute(sb.toString());

P.S. to discover component js api type in browser console

PrimeFaces.widget.VerticalTree.prototype

Answer 3

for me none of the above worked. because from what I see in the console, the child nodes don't have any ids let alone any row key number so I used jQuery advanced class selector with the help of the rowKey attribute so I had to use

String script = "PF('treeSingleWidget').selectNode($(\"td[data-rowkey='" + selectedNode.getRowKey() + "']\"))";
Primefaces.current().executeScript(script);