DOM4J <--> rich:tree (rich:treeNode)

[ratondeau]

Hi,

I have an XML Document which should be manipulated with the DOM4J framework. For display I want to use the rich:tree component.

Is it possible to bring these two together? DOM4J has an adapter class for the Swing treeNode interface. But would that also work with richfaces?

Greets

Matt

[patrickmadden]

Yes this is possible. Take a look at the TreeNodeImpl class. It has a
setData method. The object that you pass to this method is very important. You could create a simple TreeData class that has methods you need in your UI like getType, getText, getURL etc. You could have the Swing Tree node in there as an accessor as well. I have swing tree data models that I wrap with rich faces model this way.

Here is an example from my own UI: Below you'll see the word item. This is actually the data object that you will pass to the TreeNodeImpl class on the backend. Also realize that the rootnode is never shown in richfaces so if this is not a problem ok. If so, you'll have to add an extra child to the root to represent a visble root in order for it to be shown.

On the backend, iterate over your swing tree data model and create TreeNodeImpl classes with the same hierarchy as your swing tree. TreeNodeImpl has addChild methods that take an ID - I just pass integers into this incrementing it as I go.

Hope this helps.

PVM

<a:outputPanel ajaxRendered="true">
 <rich:tree
 id="searchTree"
 switchType="ajax"
 style="width:30%;float:left"
 value="#{webDocumentTreeModel.rootNode}"
 var="item"
 nodeFace="#{item.type}"
 changeExpandListener="#{webDocumentTreeModel.onExpand}"
 nodeSelectListener="#{webDocumentTreeModel.onSelect}"
 binding="#{webDocumentTreeModel.tree}"
 reRender="mainContentID">
 <rich:treeNode type="documentMgr">
 <h:outputText value="#{item.text}" />
 </rich:treeNode>
 <rich:treeNode type="document">
 <h:commandLink value="#{item.text}"
 actionListener="#{search.documentNodeClickedActionListener}">
 <f:param name="nodeid" value="#{item.nodeID}" />
 <f:param name="graphid" value="#{item.graphID}" />
 </h:commandLink>
 </rich:treeNode>
 <rich:treeNode type="cluster">
 <h:commandLink value="#{item.text}"
 actionListener="#{search.clusterNodeClickedActionListener}">
 <f:param name="nodeid" value="#{item.nodeID}" />
 <f:param name="graphid" value="#{item.graphID}" />
 </h:commandLink>
 </rich:treeNode>
 <rich:treeNode type="web">
 <h:outputLink value="#{item.searchResult.url}">
 <h:outputText value="#{item.text}" />
 </h:outputLink>
 </rich:treeNode>
 <rich:treeNode type="news">
 <h:outputLink value="#{item.searchResult.url}">
 <h:outputText value="#{item.text}" />
 </h:outputLink>
 </rich:treeNode>
 <rich:treeNode type="image">
 <h:outputLink value="#{item.searchResult.url}">
 <h:outputText value="#{item.text}" />
 </h:outputLink>
 </rich:treeNode>
 <rich:treeNode type="video">
 <h:outputLink value="#{item.searchResult.url}">
 <h:outputText value="#{item.text}" />
 </h:outputLink>
 </rich:treeNode>
 <rich:treeNode type="shopping">
 <h:outputLink value="#{item.searchResult.url}">
 <h:outputText value="#{item.text}" />
 </h:outputLink>
 </rich:treeNode>
 <rich:treeNode type="desktop">
 <h:outputText value="#{item.text}" />
 </rich:treeNode>
 <rich:treeNode type="advert">
 <h:outputText value="#{item.text}" />
 </rich:treeNode>
 </rich:tree>

[ratondeau]

let me go through this step by step to ensure I understand everything
correctly:

1. Create TreeData class that has UI methods like getType, getDesription,
and getter for the tree model and nodes etc.

2. Inject the swing tree model via setter or constructor into this class
(class BranchTreeNode from dom4j implements the Swing TreeNode
interface to bind dom4j XML Branch nodes (i.e. Document and Element
nodes) to a Swing TreeModel.

3. Build the richfaces tree by iterating through the swing tree data and
create TreeNodeImpl objects

4. ...

correct me if I am wrong, thanks for your help.

Matt

[patrickmadden]

No, you'll need a data class per node. The data class wraps each of your swing tree node objects from the dom or swing model.


You will create a RichFaces TreeNodeImpl class for each of your backend swing tree nodes using addChild method of TreeNodeImpl to recreate you swing tree model or dom model. Store the specific data class in each corresonding TreeNodeImpl class.

In your treeData class, create methods that you will use in your jsp or xhtml file such as getName, getDescription or whatever as you can see in my view code already posted.

In your backing bean expose your rootNode and use that to build your hierarchy.

It should be something like this:

javax.swing.tree.TreeNode rootSwingNode = getSwingRoot();
TreeData rootData = new TreeData(rootSwingNode);
TreeNodeImpl rootRichFacesNode = new TreeNodeImpl();
rootRichFacesNode.setData(rootData);

javax.swing.tree.TreeNode childSwingNode = rootSwingNode.getFirstChild();

TreeData childData = new TreeData(childSwingNode);
TreeNodeImpl childRichFacesNode = new TreeNodeImpl();
childRichFacesNode.setData(childData);

// add the child to the root and repeat for your other nodes to
// recreate your hiearchy
rootRichFacesNode.addChild(getNextID(), childRichFacesNode);

getNextID() should just increment some counter and return Integers or something - The id's should never change however.
You can also look at the sample code given by RichFaces.


Hope this helps.

PVM