Search results

TreeViewModel

Interface for a class TreeView

Properties

created

EmitType<Object>

Triggers when the TreeView control is created successfully.

dataBound

EmitType<DataBoundEventArgs>

Triggers when data source is populated in the TreeView.

dataSourceChanged

EmitType<DataSourceChangedEventArgs>

Triggers when data source is changed in the TreeView. The data source will be changed after performing some operation like drag and drop, node editing, adding and removing node.

destroyed

EmitType<Object>

Triggers when the TreeView control is destroyed successfully.

drawNode

EmitType<DrawNodeEventArgs>

Triggers before the TreeView node is appended to the TreeView element. It helps to customize specific nodes.

keyPress

EmitType<NodeKeyPressEventArgs>

Triggers when key press is successful. It helps to customize the operations at key press.

nodeChecked

EmitType<NodeCheckEventArgs>

Triggers when the TreeView node is checked/unchecked successfully.

nodeChecking

EmitType<NodeCheckEventArgs>

Triggers before the TreeView node is to be checked/unchecked.

nodeClicked

EmitType<NodeClickEventArgs>

Triggers when the TreeView node is clicked successfully.

nodeCollapsed

EmitType<NodeExpandEventArgs>

Triggers when the TreeView node collapses successfully.

nodeCollapsing

EmitType<NodeExpandEventArgs>

Triggers before the TreeView node collapses.

nodeDragStart

EmitType<DragAndDropEventArgs>

Triggers when the TreeView node drag (move) starts.

nodeDragStop

EmitType<DragAndDropEventArgs>

Triggers when the TreeView node drag (move) is stopped.

nodeDragging

EmitType<DragAndDropEventArgs>

Triggers when the TreeView node is dragged (moved) continuously.

nodeDropped

EmitType<DragAndDropEventArgs>

Triggers when the TreeView node is dropped on target element successfully.

nodeEdited

EmitType<NodeEditEventArgs>

Triggers when the TreeView node is renamed successfully.

nodeEditing

EmitType<NodeEditEventArgs>

Triggers before the TreeView node is renamed.

nodeExpanded

EmitType<NodeExpandEventArgs>

Triggers when the TreeView node expands successfully.

nodeExpanding

EmitType<NodeExpandEventArgs>

Triggers before the TreeView node is to be expanded.

nodeSelected

EmitType<NodeSelectEventArgs>

Triggers when the TreeView node is selected/unselected successfully.

nodeSelecting

EmitType<NodeSelectEventArgs>

Triggers before the TreeView node is selected/unselected.

allowDragAndDrop

boolean

Indicates whether the TreeView allows drag and drop of nodes. To drag and drop a node in desktop, hold the mouse on the node, drag it to the target node and drop the node by releasing the mouse. For touch devices, drag and drop operation is performed by touch, touch move and touch end. For more information on drag and drop nodes concept, refer to Drag and Drop.

allowEditing

boolean

Enables or disables editing of the text in the TreeView node. When allowEditing property is set to true, the TreeView allows you to edit the node by double clicking the node or by navigating to the node and pressing F2 key. For more information on node editing, refer to Node Editing.

allowMultiSelection

boolean

Enables or disables multi-selection of nodes. To select multiple nodes:

  • Select the nodes by holding down the CTRL key while clicking on the nodes.
  • Select consecutive nodes by clicking the first node to select and hold down the SHIFT key and click the last node to select. For more information on multi-selection, refer to Multi-Selection.

animation

NodeAnimationSettingsModel

Specifies the type of animation applied on expanding and collapsing the nodes along with duration.

autoCheck

boolean

Allow us to specify the parent and child nodes to get auto check while we check or uncheck a node.

checkedNodes

string[]

The checkedNodes property is used to set the nodes that need to be checked or get the ID of nodes that are currently checked in the TreeView component. The checkedNodes property depends upon the value of showCheckBox property. For more information on checkedNodes, refer to checkedNodes.

cssClass

string

Specifies the CSS classes to be added with root element of the TreeView to help customize the appearance of the component.

enablePersistence

boolean

Enables or disables persisting TreeView state between page reloads. If enabled, following APIs will persist.

  1. selectedNodes - Represents the nodes that are selected in the TreeView component.
  2. checkedNodes - Represents the nodes that are checked in the TreeView component.
  3. expandedNodes - Represents the nodes that are expanded in the TreeView component.

enableRtl

boolean

Enables or disables RTL mode on the component that displays the content in the right to left direction.

expandOn

string

Specifies the action on which the node expands or collapses. The available actions are,

  • Auto - In desktop, the expand/collapse operation happens when you double-click the node, and in mobile devices it happens on single-click.
  • Click - The expand/collapse operation happens when you single-click the node in both desktop and mobile devices.
  • DblClick - The expand/collapse operation happens when you double-click the node in both desktop and mobile devices.
  • None - The expand/collapse operation will not happen when you single-click or double-click the node in both desktop and mobile devices.

expandedNodes

string[]

Represents the expanded nodes in the TreeView component. We can set the nodes that need to be expanded or get the ID of the nodes that are currently expanded by using this property.

fields

FieldsSettingsModel

Specifies the data source and mapping fields to render TreeView nodes.

fullRowSelect

boolean

On enabling this property, the entire row of the TreeView node gets selected by clicking a node. When disabled only the corresponding node’s text gets selected. For more information on Fields concept, refer to Fields.

loadOnDemand

boolean

By default, load on demand is set as true. On disabling this property, all nodes are rendered at the beginning itself.

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

nodeTemplate

string

Specifies a template to render customized content for all the nodes. If the nodeTemplate property is set, the template content overrides the displayed node text. The property accepts template string template string or HTML element ID holding the content. For more information on template concept, refer to Template.

selectedNodes

string[]

Represents the selected nodes in the TreeView component. We can set the nodes that need to be selected or get the ID of the nodes that are currently selected by using this property. On enabling allowMultiSelection property we can select multiple nodes and on disabling it we can select only a single node. For more information on selectedNodes, refer to selectedNodes.

showCheckBox

boolean

Indicates that the nodes will display CheckBoxes in the TreeView. The CheckBox will be displayed next to the expand/collapse icon of the node. For more information on CheckBoxes, refer to CheckBox.

sortOrder

string

Specifies a value that indicates whether the nodes are sorted in the ascending or descending order, or are not sorted at all. The available types of sort order are,

  • None - The nodes are not sorted.
  • Ascending - The nodes are sorted in the ascending order.
  • Descending - The nodes are sorted in the ascending order.