Fork me on GitHub
Edit on GitHub

tree

NOTE: Ajax template (Dojo plugin) is deprecated and won’t be supported any longer.

Description

Renders a tree widget with AJAX support.

The "id "attribute is normally specified(recommended), such that it could be looked up using javascript if necessary. The "id" attribute is required if the "selectedNotifyTopic" or the "href" attributes are going to be used.

Parameters

Dynamic Attributes Allowed:

false
 

Name

Required

Default

Evaluated

Type

Description

accesskey false false String Set the html accesskey attribute on rendered html element
blankIconSrc false false String Blank icon image source.
childCollectionProperty false false String The childCollectionProperty property.
collapsedNotifyTopics false false String Comma separated lis of topics to be published when a node is collapsed. An object with a 'node' property will be passed as parameter to the topics.
cssClass false false String The css class to use for element
cssErrorClass false false String The css error class to use for element
cssErrorStyle false false String The css error style definitions for element to use
cssStyle false false String The css style to use for element
disabled false false String Set the html disabled attribute on rendered html element
errorNotifyTopics false false String Comma delimmited list of topics that will published after the request(if the request fails).Only valid if 'href' is set
errorPosition false false String Define error position of form element (top|bottom)
expandIconSrcMinus false false String Expand icon (-) image source.
expandIconSrcPlus false false String Expand Icon (+) image source.
expandedNotifyTopics false false String Comma separated lis of topics to be published when a node is expanded. An object with a 'node' property will be passed as parameter to the topics.
gridIconSrcC false false String Image source for under child item child icons.
gridIconSrcL false false String Image source for last child grid.
gridIconSrcP false false String Image source for under parent item child icons.
gridIconSrcV false false String Image source for vertical line.
gridIconSrcX false false String Image source for grid for sole root item.
gridIconSrcY false false String Image source for grid for last root item.
href false false String Url used to load the list of children nodes for an specific node, whose id will be passed as a parameter named 'nodeId' (empty for root)
iconHeight false 18px false String Icon height
iconWidth false 19px false String Icon width
id false false String The id to use for the element
javascriptTooltip false false false Boolean Use JavaScript to generate tooltips
key false false String Set the key (name, value, label) for this particular component
label false false String Label expression used for rendering an element specific label
labelSeparator false : false String String that will be appended to the label
labelposition false false String Define label position of form element (top/left)
name false false String The name to set for element
nodeIdProperty false false String The nodeIdProperty property.
nodeTitleProperty false false String The nodeTitleProperty property.
onblur false false String Set the html onblur attribute on rendered html element
onchange false false String Set the html onchange attribute on rendered html element
onclick false false String Set the html onclick attribute on rendered html element
ondblclick false false String Set the html ondblclick attribute on rendered html element
onfocus false false String Set the html onfocus attribute on rendered html element
onkeydown false false String Set the html onkeydown attribute on rendered html element
onkeypress false false String Set the html onkeypress attribute on rendered html element
onkeyup false false String Set the html onkeyup attribute on rendered html element
onmousedown false false String Set the html onmousedown attribute on rendered html element
onmousemove false false String Set the html onmousemove attribute on rendered html element
onmouseout false false String Set the html onmouseout attribute on rendered html element
onmouseover false false String Set the html onmouseover attribute on rendered html element
onmouseup false false String Set the html onmouseup attribute on rendered html element
onselect false false String Set the html onselect attribute on rendered html element
openTemplate false false String Set template to use for opening the rendered html.
requiredLabel false false false Boolean If set to true, the rendered element will indicate that input is required
requiredPosition false false String Define required position of required form element (left|right)
rootNode false false String The rootNode property.
selectedNotifyTopics false false String Comma separated lis of topics to be published when a node is selected. An object with a 'node' property will be passed as parameter to the topics.
showGrid false true false Boolean Show grid
showRootGrid false false String The showRootGrid property (default true).
style false false String The css style definitions for element to use - it's an alias of cssStyle attribute.
tabindex false false String Set the html tabindex attribute on rendered html element
template false false String The template (other than default) to use for rendering the element
templateCssPath false {contextPath}/struts/tree.css. false String Template css path
templateDir false false String The template directory.
title false false String Set the html title attribute on rendered html element
toggle false fade false String The toggle property (either 'explode' or 'fade')
toggleDuration false 150 false String Toggle duration in milliseconds
tooltip false false String Set the tooltip of this particular component
tooltipConfig false false String Deprecated. Use individual tooltip configuration attributes instead.
tooltipCssClass false StrutsTTClassic false String CSS class applied to JavaScrip tooltips
tooltipDelay false Classic false String Delay in milliseconds, before showing JavaScript tooltips
tooltipIconPath false false String Icon path used for image that will have the tooltip
treeCollapsedTopics false false String Deprecated. Use 'collapsedNotifyTopics' instead.
treeExpandedTopics false false String Deprecated. Use 'expandedNotifyTopics' instead.
treeSelectedTopic false false String Deprecated. Use 'selectedNotifyTopics' instead.
value false false String Preset the value of input element.

Examples

Static tree:

 <s:tree id="..." label="...">
    <s:treenode id="..." label="..." />
    <s:treenode id="..." label="...">
        <s:treenode id="..." label="..." />
        <s:treenode id="..." label="..." />
    </s:treenode>
    <s:treenode id="..." label="..." />
 </s:tree>

Dynamic tree (rendered on the server):

 <s:tree
          id="..."
          rootNode="..."
          nodeIdProperty="..."
          nodeTitleProperty="..."
          childCollectionProperty="..." />

Dynamic tree loaded with AJAX (one request is made for each node):

 <s:url id="nodesUrl" namespace="/nodecorate" action="getNodes" />
 <div style="float:left; margin-right: 50px;">
     <sx:tree id="tree" href="%{#nodesUrl}" />
 </div>
 
 On this example the url specified on the "href" attibute will be called to load
 the elements on the root. The response is expected to be a JSON array of objects like:
 [
      {
           label: "Node 1",
           hasChildren: false,
           id: "Node1"
      },
      {
           label: "Node 2",
           hasChildren: true,
           id: "Node2"
      },
 ]
 
 "label" is the text that will be displayed for the node. "hasChildren" marks the node has
 having children or not (if true, a plus icon will be assigned to the node so it can be
 expanded). The "id" attribute will be used to load the children of the node, when the node
 is expanded. When a node is expanded a request will be made to the url in the "href" attribute
 and the node's "id" will be passed in the parameter "nodeId".
 
 The children collection for a node will be loaded only once, to reload the children of a 
 node, use the "reload()" function of the treenode widget. To reload the children nodes of "Node1"
 from the example above use the following javascript:
 
 dojo.widget.byId("Node1").reload();