Wijmo UI for the Web
wijtree jQuery Widget
Present items in a hierarchical tree structure with expand and collapse animations, stylish themes, and drag-and-drop functionality.
Syntax
$(function () {
    var options; // Type:  wijmo.tree.wijtree.options
     
    $(".selector").wijtree(options);
});
function wijtree() : any;
Options
 NameDescription
public Option

Default value: false

When the allowDrag option is set to true, the tree nodes can be dragged.

 
public Option

Default value: false

When allowDrop is set to true, one tree node can be dropped within another tree node.

 
public Option

Default value: false

The allowEdit option allows a user to edit the tree nodes at run time.

 
public Option

Default value: true

The allowSorting option allows the tree nodes to be sorted at run time when the user presses the "s" key.

 
public Option

Default value: true

The allowTriState option allows the tree nodes to exhibit triState behavior. This lets the node checkboxes be checked, unchecked, or indeterminate. This option must be used with the showCheckBoxes option.

 
public Option

Default value: true

The autoCheckNodes option allows the sub-nodes to be checked when the parent nodes are checked. To use this option, showCheckboxes must be set to "true."

 
public Option

Default value: false

If this option is set to true, the expanded node will be collapsed if another node is expanded.

 
public Option

The collapseAnimation option determines the animation effect, easing, and duration for hiding child nodes when the parent node is collapsed.

Type: Object

Default: null

 
public Option

Default value: 0

This option controls the length of time in milliseconds to delay before the node collapses.

 
public Option

Default value: false

If set to true, the select, click, and check operations are disabled too.

 
public Option

Default value: null

Customize the jquery-ui-draggable plugin of wijtree.

 
public Option

Default value: null

Customize the jquery-ui-droppable plugin of wijtree.

 
public Option

Default value: null

Customizes the helper element to be used to display the position that the node will be inserted to. If a function is specified, it must return a DOMElement.

 
public Option

Type: wijmo.tree.wijtree_animation

The expandAnimation option determines the animation effect, easing, and duration for showing child nodes when the parent node is expanded.

 
public Option

Default value: false

The expandCollapseHoverUsed option allows the tree to expand or collapse when the mouse hovers over the expand/collapse button.

 
public Option

Default value: 0

The expandDelay option controls the length of time in milliseconds to delay before the node is expanded.

 
public Option

Default value: null

Set the child nodes object array as the datasource of wijtree.

 
public Option

Default value: false

The showCheckBoxes option allows the node Check Box to be shown on the tree nodes.

 
public Option

Default value: true

The showExpandCollapse option determines if the tree is displayed in an expanded or collapsed state. If set to "false," then the wijtree widget will be displayed in the expanded state.

 
Top
Methods
 NameDescription
public MethodThe add method adds a node to the tree widget.  
public MethodThe destroy method will remove the rating functionality completely and will return the element to its pre-init state.  
public MethodThe findNodeByText method finds a node by the specified node text.  
public MethodThe getCheckedNodes method gets the nodes which are checked.  
public MethodThe getNodes method gets an array that contains the root nodes of the current tree.  
public MethodThe getSelectedNodes method gets the selected nodes.  
public MethodThe remove method removes the indicated node from the wijtree element.  
public MethodReturns a jQuery object containing the original element or other relevant generated element.  
Top
Events
 NameDescription
public EventThe nodeBeforeDropped event handler is called before a draggable node is dropped in another position. If the event handler returns false, the drop action will be prevented.  
public EventThe nodeBlur event fired when the node loses focus.  
public EventThe nodeCheckChanged event fires when a node is checked.  
public EventThe nodeCheckChanging event fires before a node is checked. You can cancel this event by returning false.  
public EventThe nodeClick event fires when a tree node is clicked.  
public EventThe nodeCollapsed event fires when a tree node is collapsed.  
public EventThe nodeCollapsing event fires before a node collapses. This event can be canceled, if return false  
public EventThe nodeDragging event handler.A function called when the node is moved during a drag-and-drop operation.  
public EventThe nodeDragStarted event fires when a user starts to drag a node.  
public EventThe nodeDropped event is called when an acceptable draggable node is dropped over to another position.  
public EventThe nodeExpanded event handler. A function called when a node is expanded.  
public EventThe nodeExpanding event fires before a tree node is expanded. This event can be canceled, if return false  
public EventThe nodeFocus event fired when the node is focused.  
public EventThe nodeMouseOut event fires when the user moves the mouse pointer off of a node.  
public EventThe nodeMouseOver event fires when a user places the mouse pointer over a node.  
public EventThe nodeTextChanged event fires when the text of a node changes.  
public EventThe selectedNodeChanged event fires when the selected node changes.  
Top
See Also

Widgets

Tree

Reference

wijtree jQuery Widget