JBoss.orgCommunity Documentation
The <rich:treeNode> component is designed for creating sets of tree elements within a <rich:tree> component.
Possibility to assign different icon images for each node within a tree
Drag and Drop support
Look-and-Feel customization
The "icon" , "iconCollapsed" , "iconExpanded" , "iconLeaf" attributes define icons for the component. Also you can define icons using facets with the same names. If the facets are defined, the corresponding attributes are ignored and facets contents are used as icons. The width of a rendered facet area is 16px.
...
<rich:tree ...>
...
<rich:treeNode>
<f:facet name="icon">
<outputText value="A"/>
</f:facet>
<f:facet name="iconCollapsed">
<outputText value="B"/>
</f:facet>
<f:facet name="iconExpanded">
<outputText value="C"/>
</f:facet>
<f:facet name="iconLeaf">
<outputText value="D"/>
</f:facet>
</rich:treeNode>
...
</rich:tree>
...
As it has been mentioned above,
<rich:treeNode>
defines a template for nodes
rendering in a tree. Thus, during XML document rendering (a web.xml application) as a tree,
the following nodes output (passed via var="data"
on a tree) happens:
Example:
...
<rich:tree faceNode="simpleNode" value="#{bean.data}" var="data">
<rich:treeNode type="simpleNode">
<h:outputText value="context-param:"/>
<h:inputText value="#{data.name}"/>
</rich:treeNode>
</rich:tree>
...
Hence,
<h:outputText />
tag outputs the "context-param"
string and
then the
<h:inputText />
outputs the data.name
element of this node.
Different nodes for rendering could be defined depending on some conditions on the tree level. Each condition represents some rendering template. To get more information on various treeNodesAdaptorAdaptor definition for nodes, see the tree component chapter.
Switching between expanded/collapsed modes is also managed on the tree level and defined in the corresponding section.
Default nodes of the tree level as well as the ones defined with the treeNodesAdaptorAdaptor component could send Ajax requests when selected with the mouse, it's managed with the "ajaxSubmitSelection" attribute (true/false).
Information about the "process" attribute usage you can find " Decide what to process " guide section.
The main information on Drag and Drop operations is given in the corresponding paragraph of the tree component chapter. It's only necessary to mention that each node could also be a Drag element as well as a Drop container, i.e. the container and the element have all attributes, listeners and ways of behavior similar to the ones of the <rich:dragSupport > and <rich:dropSupport > components simultaneously.
Just as Drag and Drop operations it corresponds to the one described on the tree component level for a default Node.
Table of <rich:treeNode> attributes.
Table 6.96. Component Identification Parameters
Name | Value |
---|---|
component-type | org.richfaces.TreeNode |
component-class | org.richfaces.component.html.HtmlTreeNode |
component-family | org.richfaces.TreeNode |
renderer-type | org.richfaces.TreeNodeRenderer |
tag-class | org.richfaces.taglib.TreeNodeTag |
Table 6.97. Facets
Facet name | Description |
---|---|
icon | Redefines the icon for node. Related attribute is "icon" |
iconCollapsed | Redefines the icon for collapsed node. Related attribute is "iconCollapsed" |
iconExpanded | Redefines the icon for expanded node. Related attribute is "iconExpanded" |
iconLeaf | Redefines the icon for component leaves. Related attribute is "iconLeaf" |
Table 6.98. Classes names that define a node element
Class name | Description |
---|---|
rich-tree-node | Defines styles for a tree node |
rich-tree-node-handle | Defines styles for a tree node handle |
rich-tree-node-handleicon | Defines styles for a tree node handle icon |
rich-tree-node-children | Defines styles for all tree node subnodes |
rich-tree-node-text | Defines styles for a tree node text |
rich-tree-node-icon | Defines styles for a tree node icon |
rich-tree-h-ic-img | Defines styles for an image of a tree node |
rich-tree-node-icon-leaf | Defines styles for a tree node icon leaf |
Table 6.99. Classes names that define states for a node element
Class name | Description |
---|---|
rich-tree-node-selected | Defines styles for a selected tree node |
rich-tree-node-highlighted | Defines styles for a highlighted tree node |
rich-tree-node-handleicon-collapsed | Defines styles for a collapsed tree node handleicon |
rich-tree-node-handleicon-expanded | Defines styles for a expanded tree node handleicon |
How to Expand/Collapse Tree Nodes from code see in thiswiki article.