Creating a Tree

To create a tree:

In the Design Structure Window of the desired file, locate the node in which you wish to insert a tree component.
In the Component Palette, select Navigation Components from the dropdown list, and then drag and drop the tree component to the parent node of your choice.
The tree node is inserted and highlighted under the expanded parent node.
In the Property Inspector, set the following attributes for the tree component:
- nodes - Enter the hierarchical tree of data. This is a DataObjectList that indicates all of the "root", or top level nodes. This attribute must be databound. In the right column, click the icon to open a dialog. In the Advanced tab, you can enter an EL syntax data binding expression or use the Bind to Data dialog to select a data source.
- formSubmitted - Select true to use form submission in the expand/collapse links.
- formName - Enter the name of the form to submit to.
- proxy - Enter the proxy to use. This attribute must be databound. In the right column, click the icon to open a dialog. In the Advanced tab, you can enter an EL syntax data binding expression or use the Bind to Data dialog to select a data source.
- unvalidated - Select true to validate before any form submits generated by the tree proxy. The default is to perform no validation. This attribute is only applicable when the tree is used in formSubmitted mode.
To use a node stamp, do the following:
1. In the Design Sructure Window, expand the tree node to locate the nodeStamp named child node.
2. Right-click nodeStamp and choose Insert inside nodeStamp to insert the desired child components for the node stamp.
To make the tree interactive, see About TreeProxy.

Note: To use data binding, see Data Binding a Component Attribute.

Example (UIX XML)


Example: A tree with a databound proxy attribute.

<ctrl:content xmlns:ui="http://xmlns.oracle.com/uix/ui">
  <dataScope xmlns="http://xmlns.oracle.com/uix/ui">
    <contents>
      <tree name="tree1" proxy="${TreeProxy.proxy}">
        <nodes>
          <nodes text="Root1" expandable="collapsed"/>
          <nodes text="Root2" expandable="collapsed"/>
          <nodes text="Root3" expandable="expanded">
            <nodes text="Node3-1"/>
            <nodes text="Node3-2" expandable="expanded">
              <nodes text="Node3-2-1" selected="false" />
              <nodes text="Node3-2-2" selected="true" expandable="no"/>
              <nodes text="Node3-2-3" expandable="no"/>
            </nodes>
            <nodes text="Node3-3" expandable="no"/>
          </nodes>
          <nodes text="Root4" expandable="collapsed"/>
        </nodes>
      </tree>
    </contents>
    <provider>
      <data name="TreeProxy">
        <method class="oracle.cabo.doc.demo.DataTrees"
                method="getTreeProxy"/>
      </data>
    </provider>
  </dataScope>
</ctrl:content>

<ctrl:handlers xmlns="http://xmlns.oracle.com/uix/controller">
  <event name="expand">
    <method class="oracle.cabo.doc.demo.DataTrees"
            method="expandEventHandler"/>
  </event>
</ctrl:handlers>