Run actions from a tree

Last updated
Save as PDF

Run actions from a tree

Technologies > User Interface Add-Ins > Tree Views > Simple Tree - Departments by Division

An onClickNode event may be defined for any or all levels of the tree panel. In the first example, clicking on a division or department node will open a report(s):

In a separate example, "Tree with Bridge Table - Emp. by Room by Div.", an onclick action is defined for the leaf nodes only. Clicking a non-leaf node will issue a collapse/expand event. Clicking on the employee node (leaf node) displays a panel with employee details info on the right.

To use the selected tree record in JavaScript, define an onClickNode event in the tree panel:

<panel type="tree" id="exTreeAfterGetData_pmpsResTree" dataSource="exTreeAfterGetData_pmpsResTreeDs">
<event type="onClickNode">
<command type="callFunction" functionName="onClickResourceTreeNode"/>
</event>
...

In the JavaScript,obtain the lastNodeClicked property from the tree panel to retrieve the selected record:

function onClickResourceTreeNode(){
var curTreeNode = View.panels.get("exTreeAfterGetData_pmpTree"). lastNodeClicked ;
var itemType = curTreeNode.data["pmpstr.res_type"] ;

By default, when the user clicks on any link or button in the tree, the tree highlights the corresponding node. You can un-highlight the selected tree node from the application code:

myTree_onClickNode: function (panel, node) {
node.highlightNode(false);
// action code goes here
},

Example 1: http://localhost:8080/archibus/schema/ab-products/solutions/parts/tree/ab-ex-simple-tree-dpxdv.axvw

Example 2: http://localhost:8080/archibus/schema/ab-products/solutions/parts/tree/ab-ex-tree-after-get-data.axvw

Example 3: http://localhost:8080/archibus/schema/ab-products/solutions/parts/tree/ab-ex-tree-table.axvw