Properties Methods Events Config Options Direct Link

    Observable
      Node
        TreeNode

# Class Ext.tree.TreeNode

Package: | Ext.tree
Defined In: | TreeNode.js
Class: | TreeNode
Subclasses: | AsyncTreeNode
Extends: | Node

## Config Options

Config Options | Defined By
--- | ---
| allowChildren : Boolean False to not allow this node to have child nodes (defaults to true) | TreeNode
| allowDrag : Boolean False to make this node undraggable if draggable = true (defaults to true) | TreeNode
| allowDrop : Boolean False if this node cannot have child nodes dropped on it (defaults to true) | TreeNode
| checked : Boolean True to render a checked checkbox for this node, false to render an unchecked checkbox (defaults to undefined with no... True to render a checked checkbox for this node, false to render an unchecked checkbox (defaults to undefined with no checkbox rendered) | TreeNode
| cls : String A css class to be added to the node | TreeNode
| disabled : Boolean true to start the node disabled | TreeNode
| draggable : Boolean True to make this node draggable (defaults to false) | TreeNode
| expandable : Boolean If set to true, the node will always show a plus/minus icon, even when empty | TreeNode
| expanded : Boolean true to start the node expanded | TreeNode
| href : String URL of the link used for the node (defaults to #) | TreeNode
| hrefTarget : String target frame for the link | TreeNode
| icon : String The path to an icon for the node. The preferred way to do this is to use the cls or iconCls attributes and add the ic... The path to an icon for the node. The preferred way to do this is to use the cls or iconCls attributes and add the icon via a CSS background image. | TreeNode
| iconCls : String A css class to be added to the nodes icon element for applying css background images | TreeNode
| id : String The id for this node. If one is not specified, one is generated. | Node
| isTarget : Boolean False to not allow this node to act as a drop target (defaults to true) | TreeNode
| leaf : Boolean true if this node is a leaf and does not have children | Node
| listeners : Object A config object containing one or more event handlers to be added to this object during initialization. This should b... A config object containing one or more event handlers to be added to this object during initialization. This should be a valid listeners config object as specified in the addListener example for attaching multiple handlers at once. | Observable
| qtip : String An Ext QuickTip for the node | TreeNode
| qtipCfg : String An Ext QuickTip config for the node (used instead of qtip) | TreeNode
| singleClickExpand : Boolean True for single click expand on this node | TreeNode
| text : String The text for this node | TreeNode
| uiProvider : Function A UI class to use for this node (defaults to Ext.tree.TreeNodeUI) | TreeNode

## Public Properties

Property | Defined By
--- | ---
| attributes : Object The attributes supplied for the node. You can use this property to access any custom attributes you supplied. | Node
| childNodes : Array All child nodes of this node. | Node
| disabled : Boolean True if this node is disabled. | TreeNode
| firstChild : Node The first direct child node of this node, or null if this node has no child nodes. | Node
| id : String The node id. | Node
| lastChild : Node The last direct child node of this node, or null if this node has no child nodes. | Node
| nextSibling : Node The node immediately following this node in the tree, or null if there is no sibling node. | Node
| parentNode : Node The parent node for this node. | Node
| previousSibling : Node The node immediately preceding this node in the tree, or null if there is no sibling node. | Node
| text : String Read-only. The text for this node. To change it use setText(). | TreeNode
| ui : TreeNodeUI Read-only. The UI for this node | TreeNode

## Public Methods

Method | Defined By
--- | ---
| TreeNode( `Object/String attributes` ) Parameters: `attributes` : Object/String The attributes/config for the node or just a string with the text for the node Returns: `` | TreeNode
| addEvents( `Object object` ) : void Used to define events on this Observable Used to define events on this Observable Parameters: `object` : Object The object with the events defined Returns: `void` | Observable
- | addListener( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] ) : void Appends an event handler to this component Appends an event handler to this component Parameters: `eventName` : String The type of event to listen for `handler` : Function The method the event invokes `scope` : Object (optional) The scope in which to execute the handler function. The handler function's "this" context. `options` : Object (optional) An object containing handler configuration properties. This may contain any of the following properties: scope : Object The scope in which to execute the handler function. The handler function's "this" context. delay : Number The number of milliseconds to delay the invocation of the handler after the event fires. single : Boolean True to add a handler to handle just the next firing of the event, and then remove itself. buffer : Number Causes the handler to be scheduled to run in an Ext.util.DelayedTask delayed by the specified number of milliseconds. If the event fires again within that time, the original handler is not invoked, but the new handler is scheduled in its place. Combining Options Using the options argument, it is possible to combine different types of listeners: A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)
      el.on('click', this.onClick, this, {
          single: true,
          delay: 100,
          forumId: 4
      });
  Attaching multiple handlers in 1 call The method also allows for a single argument to be passed which is a config object containing properties which specify multiple handlers.
      foo.on({
          'click' : {
              fn: this.onClick,
              scope: this,
              delay: 100
          },
          'mouseover' : {
              fn: this.onMouseOver,
              scope: this
          },
          'mouseout' : {
              fn: this.onMouseOut,
              scope: this
          }
      });
  Or a shorthand syntax:
      foo.on({
          'click' : this.onClick,
          'mouseover' : this.onMouseOver,
          'mouseout' : this.onMouseOut,
           scope: this
      });
Returns: `void` | Observable
| appendChild( `Node/Array node` ) : Node Insert node(s) as the last child node of this node. Insert node(s) as the last child node of this node. Parameters: `node` : Node/Array The node or Array of nodes to append Returns: `Node` The appended node if single append, or null if an array was passed | Node
| bubble( `Function fn`, [`Object scope`], [`Array args`] ) : void Bubbles up the tree from this node, calling the specified function with each node. The scope (this) of function call ... Bubbles up the tree from this node, calling the specified function with each node. The scope (this) of function call will be the scope provided or the current node. The arguments to the function will be the args provided or the current node. If the function returns false at any point, the bubble is stopped. Parameters: `fn` : Function The function to call `scope` : Object (optional) The scope of the function (defaults to current node) `args` : Array (optional) The args to call the function with (default to passing the current node) Returns: `void` | Node
| cascade( `Function fn`, [`Object scope`], [`Array args`] ) : void Cascades down the tree from this node, calling the specified function with each node. The scope (this) of function ca... Cascades down the tree from this node, calling the specified function with each node. The scope (this) of function call will be the scope provided or the current node. The arguments to the function will be the args provided or the current node. If the function returns false at any point, the cascade is stopped on that branch. Parameters: `fn` : Function The function to call `scope` : Object (optional) The scope of the function (defaults to current node) `args` : Array (optional) The args to call the function with (default to passing the current node) Returns: `void` | Node
| collapse( [`Boolean deep`], [`Boolean anim`] ) : void Collapse this node. Collapse this node. Parameters: `deep` : Boolean (optional) True to collapse all children as well `anim` : Boolean (optional) false to cancel the default animation Returns: `void` | TreeNode
| collapseChildNodes( [`Boolean deep`] ) : void Collapse all child nodes Collapse all child nodes Parameters: `deep` : Boolean (optional) true if the child nodes should also collapse their child nodes Returns: `void` | TreeNode
| contains( `Node node` ) : Boolean Returns true if this node is an ancestor (at any point) of the passed node. Returns true if this node is an ancestor (at any point) of the passed node. Parameters: `node` : Node Returns: `Boolean` | Node
| disable() : void Disables this node Disables this node Parameters: None. Returns: `void` | TreeNode
| eachChild( `Function fn`, [`Object scope`], [`Array args`] ) : void Interates the child nodes of this node, calling the specified function with each node. The scope (this) of function c... Interates the child nodes of this node, calling the specified function with each node. The scope (this) of function call will be the scope provided or the current node. The arguments to the function will be the args provided or the current node. If the function returns false at any point, the iteration stops. Parameters: `fn` : Function The function to call `scope` : Object (optional) The scope of the function (defaults to current node) `args` : Array (optional) The args to call the function with (default to passing the current node) Returns: `void` | Node
| enable() : void Enables this node Enables this node Parameters: None. Returns: `void` | TreeNode
| ensureVisible() : void Ensures all parent nodes are expanded, and if necessary, scrolls the node into view. Ensures all parent nodes are expanded, and if necessary, scrolls the node into view. Parameters: None. Returns: `void` | TreeNode
| expand( [`Boolean deep`], [`Boolean anim`], [`Function callback`] ) : void Expand this node. Expand this node. Parameters: `deep` : Boolean (optional) True to expand all children as well `anim` : Boolean (optional) false to cancel the default animation `callback` : Function (optional) A callback to be called when expanding this node completes (does not wait for deep expand to complete). Called with 1 parameter, this node. Returns: `void` | TreeNode
| expandChildNodes( [`Boolean deep`] ) : void Expand all child nodes Expand all child nodes Parameters: `deep` : Boolean (optional) true if the child nodes should also expand their child nodes Returns: `void` | TreeNode
| findChild( `String attribute`, `Mixed value` ) : Node Finds the first child that has the attribute with the specified value. Finds the first child that has the attribute with the specified value. Parameters: `attribute` : String The attribute name `value` : Mixed The value to search for Returns: `Node` The found child or null if none was found | Node
| findChildBy( `Function fn`, [`Object scope`] ) : Node Finds the first child by a custom function. The child matches if the function passed returns true. Finds the first child by a custom function. The child matches if the function passed returns true. Parameters: `fn` : Function `scope` : Object (optional) Returns: `Node` The found child or null if none was found | Node
| fireEvent( `String eventName`, `Object... args` ) : Boolean Fires the specified event with the passed parameters (minus the event name). Fires the specified event with the passed parameters (minus the event name). Parameters: `eventName` : String `args` : Object... Variable number of parameters are passed to handlers Returns: `Boolean` returns false if any of the handlers return false otherwise it returns true | Observable
| getDepth() : Number Returns depth of this node (the root node has a depth of 0) Returns depth of this node (the root node has a depth of 0) Parameters: None. Returns: `Number` | Node
| getOwnerTree() : Tree Returns the tree this node is in. Returns the tree this node is in. Parameters: None. Returns: `Tree` | Node
| getPath( [`String attr`] ) : String Returns the path for this node. The path can be used to expand or select this node programmatically. Returns the path for this node. The path can be used to expand or select this node programmatically. Parameters: `attr` : String (optional) The attr to use for the path (defaults to the node's id) Returns: `String` The path | Node
| getUI() : TreeNodeUI Returns the UI object for this node. Returns the UI object for this node. Parameters: None. Returns: `TreeNodeUI` The object which is providing the user interface for this tree node. Unless otherwise specified in the {@link #uiProvider}, this will be an instance of {@link Ext.tree.TreeNodeUI} | TreeNode
| hasListener( `String eventName` ) : Boolean Checks to see if this object has any listeners for a specified event Checks to see if this object has any listeners for a specified event Parameters: `eventName` : String The name of the event to check for Returns: `Boolean` True if the event is being listened for, else false | Observable
| indexOf( `Node node` ) : Number Returns the index of a child node Returns the index of a child node Parameters: `node` : Node Returns: `Number` The index of the node or -1 if it was not found | Node
| insertBefore( `Node node`, `Node refNode` ) : Node Inserts the first node before the second node in this nodes childNodes collection. Inserts the first node before the second node in this nodes childNodes collection. Parameters: `node` : Node The node to insert `refNode` : Node The node to insert before (if null the node is appended) Returns: `Node` The inserted node | Node
| isAncestor( `Node node` ) : Boolean Returns true if the passed node is an ancestor (at any point) of this node. Returns true if the passed node is an ancestor (at any point) of this node. Parameters: `node` : Node Returns: `Boolean` | Node
| isExpanded() : Boolean Returns true if this node is expanded Returns true if this node is expanded Parameters: None. Returns: `Boolean` | TreeNode
| isFirst() : Boolean Returns true if this node is the first child of its parent Returns true if this node is the first child of its parent Parameters: None. Returns: `Boolean` | Node
| isLast() : Boolean Returns true if this node is the last child of its parent Returns true if this node is the last child of its parent Parameters: None. Returns: `Boolean` | Node
| isLeaf() : Boolean Returns true if this node is a leaf Returns true if this node is a leaf Parameters: None. Returns: `Boolean` | Node
| isSelected() : Boolean Returns true if this node is selected Returns true if this node is selected Parameters: None. Returns: `Boolean` | TreeNode
| item( `Number index` ) : Node Returns the child node at the specified index. Returns the child node at the specified index. Parameters: `index` : Number Returns: `Node` | Node
| on( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] ) : void Appends an event handler to this element (shorthand for addListener) Appends an event handler to this element (shorthand for addListener) Parameters: `eventName` : String The type of event to listen for `handler` : Function The method the event invokes `scope` : Object (optional) The scope in which to execute the handler function. The handler function's "this" context. `options` : Object (optional) Returns: `void` | Observable
| purgeListeners() : void Removes all listeners for this object Removes all listeners for this object Parameters: None. Returns: `void` | Observable
| remove() : Node Removes this node from it's parent Removes this node from it's parent Parameters: None. Returns: `Node` this | Node
| removeChild( `Node node` ) : Node Removes a child node from this node. Removes a child node from this node. Parameters: `node` : Node The node to remove Returns: `Node` The removed node | Node
| removeListener( `String eventName`, `Function handler`, [`Object scope`] ) : void Removes a listener Removes a listener Parameters: `eventName` : String The type of event to listen for `handler` : Function The handler to remove `scope` : Object (optional) The scope (this object) for the handler Returns: `void` | Observable
| replaceChild( `Node newChild`, `Node oldChild` ) : Node Replaces one child node in this node with another. Replaces one child node in this node with another. Parameters: `newChild` : Node The replacement node `oldChild` : Node The node to replace Returns: `Node` The replaced node | Node
| resumeEvents() : void Resume firing events. (see suspendEvents) Resume firing events. (see suspendEvents) Parameters: None. Returns: `void` | Observable
| select() : void Triggers selection of this node Triggers selection of this node Parameters: None. Returns: `void` | TreeNode
| setText( `String text` ) : void Sets the text for this node Sets the text for this node Parameters: `text` : String Returns: `void` | TreeNode
| sort( `Function fn`, [`Object scope`] ) : void Sorts this nodes children using the supplied sort function Sorts this nodes children using the supplied sort function Parameters: `fn` : Function `scope` : Object (optional) Returns: `void` | Node
| suspendEvents() : void Suspend the firing of all events. (see resumeEvents) Suspend the firing of all events. (see resumeEvents) Parameters: None. Returns: `void` | Observable
| toggle() : void Toggles expanded/collapsed state of the node Toggles expanded/collapsed state of the node Parameters: None. Returns: `void` | TreeNode
| un( `String eventName`, `Function handler`, [`Object scope`] ) : void Removes a listener (shorthand for removeListener) Removes a listener (shorthand for removeListener) Parameters: `eventName` : String The type of event to listen for `handler` : Function The handler to remove `scope` : Object (optional) The scope (this object) for the handler Returns: `void` | Observable
| unselect() : void Triggers deselection of this node Triggers deselection of this node Parameters: None. Returns: `void` | TreeNode

## Public Events

Event | Defined By
--- | ---
| append : ( `Tree tree`, `Node this`, `Node node`, `Number index` ) Fires when a new child node is appended Fires when a new child node is appended Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The newly appended node `index` : Number The index of the newly appended node | Node
| beforeappend : ( `Tree tree`, `Node this`, `Node node` ) Fires before a new child is appended, return false to cancel the append. Fires before a new child is appended, return false to cancel the append. Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The child node to be appended | Node
| beforechildrenrendered : ( `Node this` ) Fires right before the child nodes for this node are rendered Fires right before the child nodes for this node are rendered Listeners will be called with the following arguments: `this` : Node This node | TreeNode
| beforeclick : ( `Node this`, `Ext.EventObject e` ) Fires before click processing. Return false to cancel the default action. Fires before click processing. Return false to cancel the default action. Listeners will be called with the following arguments: `this` : Node This node `e` : Ext.EventObject The event object | TreeNode
| beforecollapse : ( `Node this`, `Boolean deep`, `Boolean anim` ) Fires before this node is collapsed, return false to cancel. Fires before this node is collapsed, return false to cancel. Listeners will be called with the following arguments: `this` : Node This node `deep` : Boolean `anim` : Boolean | TreeNode
| beforeexpand : ( `Node this`, `Boolean deep`, `Boolean anim` ) Fires before this node is expanded, return false to cancel. Fires before this node is expanded, return false to cancel. Listeners will be called with the following arguments: `this` : Node This node `deep` : Boolean `anim` : Boolean | TreeNode
| beforeinsert : ( `Tree tree`, `Node this`, `Node node`, `Node refNode` ) Fires before a new child is inserted, return false to cancel the insert. Fires before a new child is inserted, return false to cancel the insert. Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The child node to be inserted `refNode` : Node The child node the node is being inserted before | Node
| beforemove : ( `Tree tree`, `Node this`, `Node oldParent`, `Node newParent`, `Number index` ) Fires before this node is moved to a new location in the tree. Return false to cancel the move. Fires before this node is moved to a new location in the tree. Return false to cancel the move. Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `oldParent` : Node The parent of this node `newParent` : Node The new parent this node is moving to `index` : Number The index it is being moved to | Node
| beforeremove : ( `Tree tree`, `Node this`, `Node node` ) Fires before a child is removed, return false to cancel the remove. Fires before a child is removed, return false to cancel the remove. Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The child node to be removed | Node
| checkchange : ( `Node this`, `Boolean checked` ) Fires when a node with a checkbox's checked property changes Fires when a node with a checkbox's checked property changes Listeners will be called with the following arguments: `this` : Node This node `checked` : Boolean | TreeNode
| click : ( `Node this`, `Ext.EventObject e` ) Fires when this node is clicked Fires when this node is clicked Listeners will be called with the following arguments: `this` : Node This node `e` : Ext.EventObject The event object | TreeNode
| collapse : ( `Node this` ) Fires when this node is collapsed Fires when this node is collapsed Listeners will be called with the following arguments: `this` : Node This node | TreeNode
| contextmenu : ( `Node this`, `Ext.EventObject e` ) Fires when this node is right clicked Fires when this node is right clicked Listeners will be called with the following arguments: `this` : Node This node `e` : Ext.EventObject The event object | TreeNode
| dblclick : ( `Node this`, `Ext.EventObject e` ) Fires when this node is double clicked Fires when this node is double clicked Listeners will be called with the following arguments: `this` : Node This node `e` : Ext.EventObject The event object | TreeNode
| disabledchange : ( `Node this`, `Boolean disabled` ) Fires when the disabled status of this node changes Fires when the disabled status of this node changes Listeners will be called with the following arguments: `this` : Node This node `disabled` : Boolean | TreeNode
| expand : ( `Node this` ) Fires when this node is expanded Fires when this node is expanded Listeners will be called with the following arguments: `this` : Node This node | TreeNode
| insert : ( `Tree tree`, `Node this`, `Node node`, `Node refNode` ) Fires when a new child node is inserted. Fires when a new child node is inserted. Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The child node inserted `refNode` : Node The child node the node was inserted before | Node
| move : ( `Tree tree`, `Node this`, `Node oldParent`, `Node newParent`, `Number index` ) Fires when this node is moved to a new location in the tree Fires when this node is moved to a new location in the tree Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `oldParent` : Node The old parent of this node `newParent` : Node The new parent of this node `index` : Number The index it was moved to | Node
| remove : ( `Tree tree`, `Node this`, `Node node` ) Fires when a child node is removed Fires when a child node is removed Listeners will be called with the following arguments: `tree` : Tree The owner tree `this` : Node This node `node` : Node The removed node | Node
| textchange : ( `Node this`, `String text`, `String oldText` ) Fires when the text for this node is changed Fires when the text for this node is changed Listeners will be called with the following arguments: `this` : Node This node `text` : String The new text `oldText` : String The old text | TreeNode