E-mail
With Ext JS, one can add custom attributes to a Tree Node and then later access those attributes from the node (when the node is clicked, for example). In other words, a Tree Node can carry as much metadata as you care to cram into it - not just the standard attributes designed for the Tree Node.
In this post, I will describe how to do this assuming that you have an Ext JS tree that is populated by JSON. If you're not familiar with using JSON to create a tree, you might first review Ext JS Tree with JSON, Java, and Spring.
Following is an example of JSON for creating an Ext JS tree, which uses only standard attributes:
Following is a similar example, but with the addition of a custom attribute we call 'filePath'.
As you can see, it's pretty simple to add custom attributes to each node; you just shove them in there along with, and in the same way that you do, the standard attributes like 'id', 'text', and 'leaf'.
To access a custom attribute from a tree node, you use theTreeNode.attributes.customAttributeName. Take a look at the following handler function, for example, which is written to respond to the Open command in a context menu that appears when users right-click a tree node. In this case, I am simply alerting the value of the custom attribute for the node that was clicked.