Tree Controls and Tree Node Controls |
Tree controls and their associated tree node controls can be found under the Controls tab of the Controls Tree. Tree views are typically used to display parent-child-grandchild-etc data. Clicking the item in the tree view will make this record the current record in the associated data source: associated fields elsewhere on the page will respond to this. This means that when you have built your tree view all you need to do is associate some fields to the data source and you are able to view and edit the data without any additional coding.
Summary The components that make up a working tree view are: Tree Control, for each level in the tree a Tree Node Control, one Table Data Source for each type of root node and for each child node a Related Data source. In the tree control you specify which node is the root node. With each Node you specify which node(s) is (are) its child node. A node may be its own child node. NOTE 1: The tree view handles the synchronization between the data sources therefore you should clear the synchronization table property of the relate on the associated related data source. NOTE 2: It is only possible to associate a Tree Node Control with one column of a data source and this is the column that will displayed in the tree view. To display more then one column in the tree view: add an extra column to the data source and use its output expression to concatenate multiple columns: e.g. column1 || ': ' || column2. Then associate the Tree Node Control with this extra column. Quick steps for setting up a tree view:
See Also Configuring your Web Application with USoft Web Designer and CSS |