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
Javascript (Usage) 
$(function () {
    var options; // Type:  wijmo.tree.wijtree.options
     
    $(".selector").wijtree(options);
});
Javascript (Specification) 
function wijtree() : any;
Browser Compatibility
7
5
5
Options
 NameDescription
public OptionallowDrag

Default value: false

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

 
public OptionallowDrop

Default value: false

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

 
public OptionallowEdit

Default value: false

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

 
public OptionallowSorting

Default value: true

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

 
public OptionallowTriState

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 OptionautoCheckNodes

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 OptionautoCollapse

Default value: false

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

 
public OptioncollapseAnimation

Type: wijmo.tree.wijtree_animation

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

 
public OptioncollapseDelay

Default value: 0

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

 
public Optiondisabled

Default value: false

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

 
public Optiondraggable

Default value: null

Customize the jquery-ui-draggable plugin of wijtree.

 
public Optiondroppable

Default value: null

Customize the jquery-ui-droppable plugin of wijtree.

 
public OptiondropVisual

Default value: null

undefined

 
public OptionexpandAnimation

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 OptionexpandCollapseHoverUsed

Default value: false

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

 
public OptionexpandDelay

Default value: 0

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

 
public Optionnodes

Default value: null

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

 
public OptionshowCheckBoxes

Default value: false

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

 
public OptionshowExpandCollapse

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 MethodaddThe add method adds a node to the tree widget.  
public MethoddestroyThe destroy method will remove the rating functionality completely and will return the element to its pre-init state.  
public MethodfindNodeByTextThe findNodeByText method finds a node by the specified node text.  
public MethodgetCheckedNodesThe getCheckedNodes method gets the nodes which are checked.  
public MethodgetNodesThe getNodes method gets an array that contains the root nodes of the current tree.  
public MethodgetSelectedNodesThe getSelectedNodes method gets the selected nodes.  
public MethodremoveThe remove method removes the indicated node from the wijtree element.  
public MethodwidgetReturns a jQuery object containing the original element or other relevant generated element.  
Top
Events
 NameDescription
public EventnodeBeforeDroppedThe 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 EventnodeBlurThe nodeBlur event fired when the node loses focus.  
public EventnodeCheckChangedThe nodeCheckChanged event fires when a node is checked.  
public EventnodeClickThe nodeClick event fires when a tree node is clicked.  
public EventnodeCollapsedThe nodeCollapsed event fires when a tree node is collapsed.  
public EventnodeCollapsingThe nodeCollapsing event fires before a node collapses. This event can be canceled, if return false  
public EventnodeDraggingThe nodeDragging event handler.A function called when the node is moved during a drag-and-drop operation.  
public EventnodeDragStartedThe nodeDragStarted event fires when a user starts to drag a node.  
public EventnodeDroppedThe nodeDropped event is called when an acceptable draggable node is dropped over to another position.  
public EventnodeExpandedThe nodeExpanded event handler. A function called when a node is expanded.  
public EventnodeExpandingThe nodeExpanding event fires before a tree node is expanded. This event can be canceled, if return false  
public EventnodeFocusThe nodeFocus event fired when the node is focused.  
public EventnodeMouseOutThe nodeMouseOut event fires when the user moves the mouse pointer off of a node.  
public EventnodeMouseOverThe nodeMouseOver event fires when a user places the mouse pointer over a node.  
public EventnodeTextChangedThe nodeTextChanged event fires when the text of a node changes.  
public EventselectedNodeChangedThe selectedNodeChanged event fires when the selected node changes.  
Top

See Also

Widgets

Tree

Reference

wijtree jQuery Widget

 

 


© 2013 All Rights Reserved.

Send comments on this topic.