Tree nodes

The Ext.data.NodeInterface class is a set of methods that are applied to the model to decorate it with a node API. This means that when we use a model with a tree, the model will have all the tree-related methods. This class also creates extra fields on the model to help maintain the tree state and the UI.

The most common field configurations are the following:

• text: This property configures the text to show up on the node label.

• root: This property is true if this is the root node.

• leaf: If this property is set to true, it indicates that this child can have no children. The expand icon/arrow will not be rendered for this node.

• expanded: This is true if the node is expanded.

• iconCls: This property configures the CSS class to apply for this node's icon.

• children: This configures an array of child nodes.

• checked: This property is set to true or false to show a checkbox alongside this node.

For better understanding, take a look at the following diagram:

Remember that you don't always...