Vue TreeList Events

This section describes events raised by this widget.

adaptiveDetailRowPreparing

Raised before an adaptive detail row is rendered.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
formOptions	Object	The options of the Form widget.
model	Object	The model data. Available only if you use Knockout.

Main article: onAdaptiveDetailRowPreparing

cellClick

Raised when a cell is clicked or tapped.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cellElement	HTMLElement \| jQuery	The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
column	Object	This column's configuration.
columnIndex	Number	The index of the column to which the cell belongs.
component	TreeList	The widget's instance.
data	Object	The data of the row to which the cell belongs. Available if the rowType is "data", "detail" or "detailAdaptive".
displayValue	any	The cell's displayed value. Available if the rowType is "data". Differs from the value field only when the cell belongs to the lookup column.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
jQueryEvent	jQuery.Event	Use 'event' instead. The jQuery event that caused the handler execution. Deprecated in favor of the event field.
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive". For plain data, the key value depends on the keyExpr option. For hierarchical data, the key is generated automatically or set in the underlying Store of the data source.
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row properties. Available if the rowType is "data", "detail" or "detailAdaptive".
rowIndex	Number	The index of the row to which the cell belongs. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
text	String	The cell's formatted value converted to a string. Available if the rowType is "data".
value	any	The cell's raw value. Available if the rowType is "data".

Main article: onCellClick

cellDblClick

Raised when a cell is double-clicked or double-tapped.

Type:

Event

Function parameters:

e:

Object

Information about the event that caused the function's execution.

Object structure:

Name	Type	Description
cellElement	HTMLElement \| jQuery	The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
column	TreeList Column	The column's configuration.
columnIndex	Number	The index of the column the cell belongs to.
component	TreeList	The widget's instance.
data	Object	The data of the row the cell belongs to. Available if the rowType is "data", "detail" or "detailAdaptive".
displayValue	any	The value displayed in the cell. Available if the rowType is "data". Differs from the value field only when the cell belongs to a lookup column.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive".
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row's properties. Available if the rowType is "data", "detail" or "detailAdaptive".
rowIndex	Number	The index of the row the cell belongs to. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
text	String	The cell's formatted value converted to a string. Available if the rowType is "data".
value	any	The cell's raw value. Available if the rowType is "data".

Main article: onCellDblClick

cellHoverChanged

Raised when the pointer enters or leaves a cell.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cellElement	HTMLElement \| jQuery	The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
column	TreeList Column	This column's configuration.
columnIndex	Number	The index of the column to which the cell belongs.
component	TreeList	The widget's instance.
data	Object	The data of the row to which the cell belongs. Available if the rowType is "data", "detail" or "detailAdaptive".
displayValue	any	The cell's displayed value. Available if the rowType is "data". Differs from the value field only when the cell belongs to the lookup column.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
eventType	String	Indicates whether the pointer entered or left the cell. Can be either "mouseover" or "mouseout".
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive". For plain data, the key value depends on the keyExpr option. For hierarchical data, the key is generated automatically or set in the underlying Store of the data source.
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row properties. Available if the rowType is "data", "detail" or "detailAdaptive".
rowIndex	Number	The index of the row to which the cell belongs. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
text	String	The cell's formatted value converted to a string. Available if the rowType is "data".
value	any	The cell's raw value. Available if the rowType is "data".

Main article: onCellHoverChanged

cellPrepared

Raised after a cell is created.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cellElement	HTMLElement \| jQuery	The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
column	TreeList Column	This column's configuration.
columnIndex	Number	The index of the column to which the cell belongs.
component	TreeList	The widget's instance.
data	Object	The data of the row to which the cell belongs. Available if the rowType is "data", "detail" or "detailAdaptive".
displayValue	any	The cell's displayed value. Available if the rowType is "data". Differs from the value field only when the cell belongs to the lookup column.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
isExpanded	Boolean	Indicates whether the row is expanded or collapsed. Available if rowType is "data" or "detail".
isNewRow	Boolean	Indicates that the row is added, but not yet saved.
isSelected	Boolean	Indicates whether the row is selected. Available if rowType is "data" or "detail".
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive". For plain data, the key value depends on the keyExpr option. For hierarchical data, the key is generated automatically or set in the underlying Store of the data source.
model	Object	The model data. Available only if you use Knockout.
oldValue	any	The cell's previous raw value.
row	TreeList Row	The row properties. Available if the rowType is "data", "detail" or "detailAdaptive".
rowIndex	Number	The row's index. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
text	String	The cell's formatted value converted to a string. Available if the rowType is "data".
value	any	The cell's raw value. Available if the rowType is "data".
watch	Function	Allows tracking a variable and performing actions when it changes. Applies when repaintChangesOnly is true. This function has the following parameters: getter(data): Function A function that returns the variable that should be tracked. handler(newValue): Function A function called when this variable changes.

Main article: onCellPrepared

contentReady

Raised when the widget's content is ready.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name

Type

Description

component

TreeList

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only when using Knockout.

Main article: onContentReady.

contextMenuPreparing

Raised before the context menu is rendered.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
column	TreeList Column	This column's configuration.
columnIndex	Number	The index of the column on which the context menu is invoked.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
items	Array<Object>	Items to be displayed in the context menu. Their structure is described in the Default Item Template section.
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row properties.
rowIndex	Number	The index of the row on which the context menu is invoked. Refer to Column and Row Indexes for more information.
target	String	The name of the element on which the context menu is invoked: "header", "content", or "footer". This field is read-only.
targetElement	HTMLElement \| jQuery	The element's container. It is an HTML Element or a jQuery Element when you use jQuery.

Main article: onContextMenuPreparing

dataErrorOccurred

Raised when an error occurs in the data source.

Type:

Event

Function parameters:

e:

Object

Information on the occurred error.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
error	JavaScript Error Object	The standard Error object that defines the error.
model	Object	The model data. Available only if you use Knockout.

Main article: onDataErrorOccurred

disposing

Raised before the widget is disposed of.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.

Name

Type

Description

component

TreeList

The widget instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

Main article: onDisposing

editingStart

Raised before a cell or row switches to the editing state.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel row editing.
column	Object	The configuration of the column whose cell is switching to the editing state. Available in "cell" or "batch" editing mode.
component	TreeList	The widget's instance.
data	Object	The data of the row to be edited.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The row's key. The key of an added but not yet saved row is undefined.
model	Object	The model data. Available only if Knockout is used.

Main article: onEditingStart

editorPrepared

Raised after an editor is created.

Type:

Event

Function parameters:

options:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
dataField	String	The name of the field that provides data for the column the editor belongs to.
disabled	Boolean	Indicates whether the editor is disabled.
editorElement	HTMLElement \| jQuery	The editor's container. It is an HTML Element or a jQuery Element when you use jQuery.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
parentType	String	The editor's location. One of "dataRow", "filterRow", "headerRow" or "searchPanel".
readOnly	Boolean	Indicates whether the editor is read-only.
row	TreeList Row	The properties of the row the editor belongs to.
rtlEnabled	Boolean	Indicates whether the editor uses right-to-left representation.
setValue(newValue, newText)	any	A method that you should call to change the cell value and, optionally, the displayed value after the editor's value is changed.
updateValueTimeout	Number	Gets and sets the delay between the moment a user stops typing a filter value and the moment it is applied. Available if parentType is "filterRow" or "searchPanel".
value	any	The editor's value.
width	Number	The editor's width; equals null for all editors except for those whose parentType equals "searchPanel".

Main article: onEditorPrepared

editorPreparing

Raised before an editor is created.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel creating the editor. Set it to true and implement a custom editor if your scenario requires it.
component	TreeList	The widget's instance.
dataField	String	The name of the field that provides data for the column the editor belongs to.
disabled	Boolean	Indicates whether the editor is disabled.
editorElement	HTMLElement \| jQuery	The editor's container. It is an HTML Element or a jQuery Element when you use jQuery.
editorName	String	Allows you to change the editor. Accepts names of DevExtreme widgets only, for example, "dxTextBox". Import a new editor's module when using DevExtreme modules.
editorOptions	Object	Gets and sets the editor configuration.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
parentType	String	The editor's location. One of "dataRow", "filterRow", "headerRow" or "searchPanel".
readOnly	Boolean	Indicates whether the editor is read-only.
row	TreeList Row	The properties of the row the editor belongs to.
rtlEnabled	Boolean	Indicates whether the editor uses right-to-left representation.
setValue(newValue, newText)	any	A method that you should call to change the cell value and, optionally, the displayed value after the editor's value is changed.
updateValueTimeout	Number	Gets and sets the delay between the moment a user stops typing a filter value and the moment it is applied. Available if parentType is "filterRow" or "searchPanel".
value	any	The editor's value.
width	Number	The editor's width; equals null for all editors except for those whose parentType equals "searchPanel".

Main article: onEditorPreparing

focusedCellChanged

Raised after the focused cell changes.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cellElement	HTMLElement \| jQuery	The focused cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
column	TreeList Column	The column's properties.
columnIndex	Number	The index of the cell's column.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row's properties.
rowIndex	Number	The index of the cell's row.

Main article: onFocusedCellChanged

focusedCellChanging

Raised before the focused cell changes.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel focusing a new cell.
cellElement	HTMLElement \| jQuery	The to-be-focused cell's container. It is an HTML Element or a jQuery Element when you use jQuery.
columns	Array<TreeList Column>	The visible columns' properties.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
isHighlighted	Boolean	true if the cell is highlighted; otherwise false, even if the cell's row is highlighted.
model	Object	The model data. Available only if you use Knockout.
newColumnIndex	Number	The index of the column the cell that should be focused belongs to.
newRowIndex	Number	The index of the row the cell that should be focused belongs to.
prevColumnIndex	Number	The index of the previously focused cell's column.
prevRowIndex	Number	The index of the previously focused cell's row.
rows	Array<TreeList Row>	The visible rows' properties.

Main article: onFocusedCellChanging

focusedRowChanged

Raised after the focused row changes. Applies only when focusedRowEnabled is true.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
row	TreeList Row	The row's properties.
rowElement	HTMLElement \| jQuery	The focused row's container. It is an HTML Element or a jQuery Element when you use jQuery.
rowIndex	Number	The row's index.

Main article: onFocusedRowChanged

focusedRowChanging

Raised before the focused row changes. Applies only when focusedRowEnabled is true.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel focusing a new row.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
newRowIndex	Number	The index of the row to be focused.
prevRowIndex	Number	The index of the previously focused row.
rowElement	HTMLElement \| jQuery	The to-be-focused row's container. It is an HTML Element or a jQuery Element when you use jQuery.
rows	Array<TreeList Row>	The visible rows' properties.

Main article: onFocusedRowChanging

initialized

Raised only once, after the widget is initialized.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name

Type

Description

component

TreeList

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

Main article: onInitialized

initNewRow

Raised before a new row is added to the widget.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
data	Object	The data of the inserted row; initially empty.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.

Main article: onInitNewRow

keyDown

Raised when the widget is in focus and a key has been pressed down.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
handled	Boolean	Indicates whether the widget has already handled this event.
jQueryEvent	jQuery.Event	Use 'event' instead. The jQuery event that caused the function's execution. Deprecated in favor of the event field.
model	Object	The model data. Available only if you use Knockout.

Main article: onKeyDown

nodesInitialized

Raised after the loaded nodes are initialized.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
root	TreeList Node	The root node.

Main article: onNodesInitialized

optionChanged

Raised after a widget option is changed.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
model	Object	The model data. Available only if you use Knockout.
fullName	String	The path to the modified option that includes all parent options.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
component	TreeList	The widget's instance.
name	String	The modified option if it belongs to the first level. Otherwise, the first-level option it is nested into.
value	any	The modified option's new value.

Main article: onOptionChanged

rowClick

Raised when a row is clicked or tapped.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
columns	Array<Object>	All column configurations.
component	TreeList	The widget's instance.
data	Object	The row's data.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
handled	Boolean	Indicates whether internal widget handlers have already handled the event.
isExpanded	Boolean	Indicates whether the row is expanded or collapsed. Available if rowType is "data" or "detail".
isNewRow	Boolean	Indicates that the row is added, but not yet saved.
isSelected	Boolean	Indicates whether the row is selected. Available if rowType is "data" or "detail".
jQueryEvent	jQuery.Event	Use 'event' instead. The jQuery event that caused the handler execution. Deprecated in favor of the event field.
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive". For plain data, the key value depends on the keyExpr option. For hierarchical data, the key is generated automatically or set in the underlying Store of the data source.
level	Number	The node's hierarchical level.
model	Object	The model data. Available only if you use Knockout.
node	TreeList Node	The row's node.
rowElement	HTMLElement \| jQuery	The row's container. It is an HTML Element or a jQuery Element when you use jQuery.
rowIndex	Number	The row's index. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
values	Array<any>	Values displayed in the row cells.

Main article: onRowClick

rowCollapsed

Raised after a row is collapsed.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The key of the row.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowCollapsed

rowCollapsing

Raised before a row is collapsed.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel row collapsing.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The key of the row.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowCollapsing

rowDblClick

Raised when a row is double-clicked or double-tapped.

Type:

Event

Function parameters:

e:

Object

Information about the event that caused the function's execution.

Object structure:

Name	Type	Description
columns	Array<TreeList Column>	The configurations of visible columns.
component	TreeList	The widget's instance.
data	Object	The row's data.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
event	Event (jQuery or EventObject)	The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.
isExpanded	Boolean	Indicates whether the row is expanded or collapsed. Available if rowType is "data" or "detail".
isNewRow	Boolean	Indicates that the row is added, but not yet saved.
isSelected	Boolean	Indicates whether the row is selected. Available if rowType is "data" or "detail".
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive".
model	Object	The model data. Available only if you use Knockout.
rowElement	HTMLElement \| jQuery	The row's container. It is an HTML Element or a jQuery Element when you use jQuery.
rowIndex	Number	The row's index. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
values	Array<any>	Raw values displayed in the row's cells.

Main article: onRowDblClick

rowExpanded

Raised after a row is expanded.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The key of the row.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowExpanded

rowExpanding

Raised before a row is expanded.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean	Allows you to cancel row expansion.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The key of the group or master row.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowExpanding

rowInserted

Raised after a new row has been inserted into the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
data	Object	The data of the row.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
error	JavaScript Error Object	The standard Error object defining an error that may occur during insertion.
key	any	The key of the row. If a field providing keys is not specified in the data source, the whole data object is considered the key.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowInserted

rowInserting

Raised before a new row is inserted into the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean \| Promise<void> (jQuery or native)	true, a Promise resolved with true, or a rejected Promise stops row insertion. false or a Promise resolved with false or undefined continues row insertion.
component	TreeList	The widget's instance.
data	Object	The data of the row that should be inserted.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowInserting

rowPrepared

Raised after a row is created.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
columns	Array<TreeList Column>	All column configurations.
component	TreeList	The widget's instance.
data	Object	The row's data. Available if the rowType is "data", "detail" or "detailAdaptive".
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
isExpanded	Boolean	Indicates whether the row is expanded or collapsed. Available if rowType is "data" or "detail".
isNewRow	Boolean	Indicates that the row is added, but not yet saved.
isSelected	Boolean	Indicates whether the row is selected. Available if rowType is "data" or "detail".
key	any	The row's key. Available if the rowType is "data", "detail" or "detailAdaptive". For plain data, the value of the key depends on the keyExpr option. For hierarchical data, the key is generated automatically or set in the underlying Store of the data source.
level	Number	The node's hierarchical level.
model	Object	The model data. Available only if you use Knockout.
node	TreeList Node	The row's node.
rowElement	HTMLElement \| jQuery	The row's container. It is an HTML Element or a jQuery Element when you use jQuery.
rowIndex	Number	The row's index. Refer to Column and Row Indexes for more information.
rowType	String	The row's type.
values	Array<any>	Values displayed in the row cells.

Main article: onRowPrepared

rowRemoved

Raised after a row has been removed from the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
data	Object	The data of the row.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
error	JavaScript Error Object	The standard Error object defining an error that may occur during removal.
key	any	The key of the row. If a field providing keys is not specified in the data source, the whole data object is considered the key.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowRemoved

rowRemoving

Raised before a row is removed from the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean \| Promise<void> (jQuery or native)	true, a Promise resolved with true, or a rejected Promise stops row removal. false or a Promise resolved with false or undefined continues row removal.
component	TreeList	The widget's instance.
data	Object	The data of the row that should be removed.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The row's key.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowRemoving

rowUpdated

Raised after a row has been updated in the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
data	Object	The updated data of the row.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
error	JavaScript Error Object	The standard Error object defining an error that may occur during updating.
key	any	The key of the row. If a field providing keys is not specified in the data source, the whole data object is considered the key.
model	Object	The model data. Available only if you use Knockout.

Main article: onRowUpdated

rowUpdating

Raised before a row is updated in the data source.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
cancel	Boolean \| Promise<void> (jQuery or native)	true, a Promise resolved with true, or a rejected Promise stops row updating. false or a Promise resolved with false or undefined continues row updating.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
key	any	The row's key.
model	Object	The model data. Available only if you use Knockout.
newData	Object	The row's updated data.
oldData	Object	The row's old data.

Main article: onRowUpdating

rowValidating

Raised after cells in a row are validated against validation rules.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
brokenRules	Array<RequiredRule \| NumericRule \| RangeRule \| StringLengthRule \| CustomRule \| CompareRule \| PatternRule \| EmailRule>	An array of broken rules. The structure of rule objects is described in the Validation Rules section.
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
errorText	String	An error message to be displayed.
isValid	Boolean	Indicates whether data in all cells of the row satisfies the validation rules.
key	any	The key of the row. If a field providing keys is not specified in the data source, the whole data object is considered the key.
model	Object	The model data. Available only if you use Knockout.
newData	Object	The data of the validated row after changes.
oldData	Object	The data of the validated row before changes.

Main article: onRowValidating

selectionChanged

Raised after selecting a row or clearing its selection.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
currentDeselectedRowKeys	Array<any>	The keys of the rows whose selection has been cleared.
currentSelectedRowKeys	Array<any>	The keys of the rows that have been selected.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
selectedRowKeys	Array<any>	The keys of all selected rows.
selectedRowsData	Array<Object>	The data of all selected rows. Does not include calculated values.

Main article: onSelectionChanged

toolbarPreparing

Raised before the toolbar is created.

Type:

Event

Function parameters:

e:

Object

Information about the event.

Object structure:

Name	Type	Description
component	TreeList	The widget's instance.
element	HTMLElement \| jQuery	The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.
model	Object	The model data. Available only if you use Knockout.
toolbarOptions	Toolbar Configuration	The options of the toolbar.

Main article: onToolbarPreparing

Vue TreeList Events

See Also

adaptiveDetailRowPreparing

See Also

cellClick

See Also

cellDblClick

See Also

cellHoverChanged

See Also

cellPrepared

See Also

contentReady

See Also

contextMenuPreparing

See Also

dataErrorOccurred

See Also

disposing

See Also

editingStart

See Also

editorPrepared

See Also

editorPreparing

See Also

focusedCellChanged

See Also

focusedCellChanging

See Also

focusedRowChanged

See Also

focusedRowChanging

See Also

initialized

See Also

initNewRow

See Also

keyDown

See Also

nodesInitialized

See Also

optionChanged

See Also

rowClick

See Also

rowCollapsed

See Also

rowCollapsing

See Also

rowDblClick

See Also

rowExpanded

See Also

rowExpanding

See Also

rowInserted

See Also

rowInserting

See Also

rowPrepared

See Also

rowRemoved

See Also

rowRemoving

See Also

rowUpdated

See Also

rowUpdating

See Also

rowValidating

See Also

selectionChanged

See Also

toolbarPreparing

See Also