Angular DataGrid Events
This section describes events fired by this widget.
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
adaptiveDetailRowPreparing
Raised before an adaptive detail row is rendered.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| formOptions | 
                         The options of the Form widget.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onAdaptiveDetailRowPreparing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
cellClick
Raised when a cell is clicked or tapped.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cellElement | 
                         The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| column | 
                         This column's configuration.  | 
                |
| columnIndex | 
                         The index of the column to which the cell belongs. For details on indexes, see the Column and Row Indexes topic.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row to which the cell belongs.  | 
                |
| displayValue | any | 
                         The cell's displayed value. Differs from the value field only when the column to which the clicked cell belongs uses lookup.  | 
                
| element | 
                         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 | 
                             Use 'event' instead. The jQuery event that caused the handler execution. Deprecated in favor of the event field.  | 
                |
| key | any | 
                         The row's key. If a field providing keys is not specified in the data source, the whole data object is considered the key.  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row properties.  | 
                |
| rowIndex | 
                         The index of the row to which the cell belongs. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The type of the row to which the clicked cell belongs.  | 
                |
| text | 
                         The cell's formatted value converted to a string.  | 
                |
| value | any | 
                         The cell's raw value.  | 
                
Main article: onCellClick
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
cellDblClick
Raised when a cell is double-clicked or double-tapped.
Event
Information about the event that caused the function's execution.
| Name | Type | Description | 
|---|---|---|
| cellElement | 
                         The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| column | 
                         The column's configuration.  | 
                |
| columnIndex | 
                         The index of the column the cell belongs to. For details on indexes, see the Column and Row Indexes topic.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         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" or "group".  | 
                
| element | 
                         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 or a group's key. Available if the rowType is "data", "detail", "detailAdaptive", or "group".  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row's properties. Available if the rowType is "data", "detail", "detailAdaptive", or "group".  | 
                |
| rowIndex | 
                         The index of the row the cell belongs to.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| text | 
                         The cell's formatted value converted to a string. Available if the rowType is "data" or "group".  | 
                |
| value | any | 
                         The cell's raw value. Available if the rowType is "data" or "group".  | 
                
Main article: onCellDblClick
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
cellHoverChanged
Raised after the pointer enters or leaves a cell.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cellElement | 
                         The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| column | 
                         This column's configuration.  | 
                |
| columnIndex | 
                         The index of the column to which the cell belongs. For details on indexes, see the Column and Row Indexes topic.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row to which the cell belongs.  | 
                |
| displayValue | any | 
                         The cell's displayed value. Differs from the value field only when the column to which the current cell belongs uses lookup.  | 
                
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| eventType | 
                         Indicates whether the pointer entered or left the cell. Can be either "mouseover" or "mouseout".  | 
                |
| key | any | 
                         The row's key. If a field providing keys is not specified in the data source, the whole data object is considered the key.  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row properties.  | 
                |
| rowIndex | 
                         The row's index. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| text | 
                         The cell's formatted value converted to a string.  | 
                |
| value | any | 
                         The cell's raw value.  | 
                
Main article: onCellHoverChanged
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
cellPrepared
Raised after a cell is created.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cellElement | 
                         The cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| column | 
                         This column's configuration.  | 
                |
| columnIndex | 
                         The index of the column to which the cell belongs. For details on indexes, see the Column and Row Indexes topic.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row to which the cell belongs. Unavailable if rowType is "header", "filter" or "totalFooter".  | 
                |
| displayValue | any | 
                         The cell's displayed value. Differs from the value field only when the column to which the prepared cell belongs uses lookup.  | 
                
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| isExpanded | 
                         Indicates whether the row is expanded or collapsed. Unavailable if rowType is "header", "filter" or "totalFooter".  | 
                |
| isNewRow | 
                         Indicates that the row is added, but not yet saved.  | 
                |
| isSelected | 
                         Indicates whether the row is selected.  | 
                |
| key | any | 
                         The row's key. Unavailable if rowType is "header", "filter" or "totalFooter".  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| oldValue | any | 
                         The cell's previous raw value.  | 
                
| row | 
                         The row properties.  | 
                |
| rowIndex | 
                         The row's index. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| text | 
                         The cell's formatted value converted to a string.  | 
                |
| value | any | 
                         The cell's raw value.  | 
                
| watch | 
                         Allows tracking a variable and performing actions when it changes. Applies when repaintChangesOnly is true. 
  | 
                
Main article: onCellPrepared
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
contentReady
Raised when the widget's content is ready.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only when using Knockout.  | 
                
Main article: onContentReady.
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
contextMenuPreparing
Raised before the context menu is rendered.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| column | 
                         This column's configuration.  | 
                |
| columnIndex | 
                         The index of the column on which the context menu is invoked. For details on indexes, see the Column and Row Indexes topic.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| items | 
                         Items to be displayed in the context menu. Their structure is described in the Default Item Template section.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row properties.  | 
                |
| rowIndex | 
                         The index of the row on which the context menu is invoked. Refer to Column and Row Indexes for more information.  | 
                |
| target | 
                         The name of the element on which the context menu is invoked: "headerPanel", "header", "content", or "footer". This field is read-only.  | 
                |
| targetElement | 
                         The grid element's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                
Main article: onContextMenuPreparing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
dataErrorOccurred
Raised when an error occurs in the data source.
Event
Information on the occurred error.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| error | 
                         The standard Error object that defines the error.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onDataErrorOccurred
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
disposing
Raised before the widget is disposed of.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onDisposing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
editingStart
Raised before a cell or row switches to the editing state.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel row editing.  | 
                |
| column | 
                         The configuration of the column whose cell is switching to the editing state. Available in the "batch" editing mode.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of a row to be edited.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if Knockout is used.  | 
                
Main article: onEditingStart
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
editorPrepared
Raised after an editor is created.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| dataField | 
                         The name of the field that provides data for the column the editor belongs to.  | 
                |
| disabled | 
                         Indicates whether the editor is disabled.  | 
                |
| editorElement | 
                         The editor's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| parentType | 
                         The editor's location. One of "dataRow", "filterRow", "headerRow" or "searchPanel".  | 
                |
| readOnly | 
                         Indicates whether the editor is read-only.  | 
                |
| row | 
                         The properties of the row the editor belongs to.  | 
                |
| rtlEnabled | 
                         Indicates whether the editor uses a 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 | 
                         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 | 
                         The editor's width; equals null for all editors except for those whose parentType equals "searchPanel".  | 
                
Main article: onEditorPrepared
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
editorPreparing
Raised before an editor is created.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel creating the editor.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| dataField | 
                         The name of the field that provides data for the column the editor belongs to.  | 
                |
| disabled | 
                         Indicates whether the editor is disabled.  | 
                |
| editorElement | 
                         The editor's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| editorName | 
                         Allows you to change the editor. Accepts names of DevExtreme widgets only, for example, "dxTextBox".  | 
                |
| editorOptions | 
                         Gets and sets the editor configuration.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| parentType | 
                         The editor's location. One of "dataRow", "filterRow", "headerRow" or "searchPanel".  | 
                |
| readOnly | 
                         Indicates whether the editor is read-only.  | 
                |
| row | 
                         The properties of the row the editor belongs to.  | 
                |
| rtlEnabled | 
                         Indicates whether the editor uses a 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 | 
                         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 | 
                         The editor's width; equals null for all editors except for those whose parentType equals "searchPanel".  | 
                
Main article: onEditorPreparing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
exported
Raised after data is exported.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if Knockout is used.  | 
                
Main article: onExported
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
exporting
Raised before data is exported.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel exporting.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| fileName | 
                         The name of the file to which grid data is about to be exported.  | 
                |
| model | 
                         The model data. Available only if Knockout is used.  | 
                
Main article: onExporting
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
fileSaving
Raised before a file with exported data is saved to the user's local storage.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel file saving.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         Exported data as a BLOB.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| fileName | 
                         The name of the file to be saved.  | 
                |
| format | 
                         The format of this file. Equals "EXCEL" for an Excel file.  | 
                
Main article: onFileSaving
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
focusedCellChanged
Raised after the focused cell changes.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cellElement | 
                         The focused cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| column | 
                         The column's properties.  | 
                |
| columnIndex | 
                         The index of the cell's column.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row's properties.  | 
                |
| rowIndex | 
                         The index of the cell's row.  | 
                
Main article: onFocusedCellChanged
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
focusedCellChanging
Raised before the focused cell changes.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel focusing a new cell.  | 
                |
| cellElement | 
                         The to-be-focused cell's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| columns | 
                         The visible columns' properties.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         true if the cell is highlighted; otherwise false, even if the cell's row is highlighted.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| newColumnIndex | 
                         The index of the column the cell that should be focused belongs to.  | 
                |
| newRowIndex | 
                         The index of the column the row that should be focused belongs to.  | 
                |
| prevColumnIndex | 
                         The index of the previously focused cell's column.  | 
                |
| prevRowIndex | 
                         The index of the previously focused cell's row.  | 
                |
| rows | 
                         The visible rows' properties.  | 
                
Main article: onFocusedCellChanging
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
focusedRowChanged
Raised after the focused row changes. Applies only when focusedRowEnabled is true.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| row | 
                         The row's properties.  | 
                |
| rowElement | 
                         The focused row's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| rowIndex | 
                         The row's index.  | 
                
Main article: onFocusedRowChanged
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
focusedRowChanging
Raised before the focused row changes. Applies only when focusedRowEnabled is true.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel focusing a new row.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                |
| newRowIndex | 
                         The index of the row to be focused.  | 
                |
| prevRowIndex | 
                         The index of the previously focused row.  | 
                |
| rowElement | 
                         The to-be-focused row's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| rows | 
                         The visible rows' properties.  | 
                
Main article: onFocusedRowChanging
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
initialized
Raised only once, after the widget is initialized.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                
Main article: onInitialized
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
initNewRow
Raised before a new row is added to the widget.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the inserted row; initially empty.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onInitNewRow
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
keyDown
Raised when the widget is in focus and a key has been pressed down.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         Indicates whether the widget has already handled this event.  | 
                |
| jQueryEvent | 
                             Use 'event' instead. The jQuery event that caused the function's execution. Deprecated in favor of the event field.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onKeyDown
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
optionChanged
Raised after a widget option is changed.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| fullName | 
                         The path to the modified option that includes all parent options.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| name | 
                         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
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowClick
Raised when a row is clicked or tapped.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| columns | 
                         All column configurations.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The row's data.  | 
                |
| element | 
                         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.  | 
                
| groupIndex | 
                         The row's group index. Available if rowType is "group".  | 
                |
| handled | 
                         Indicates whether internal widget handlers have already handled the event.  | 
                |
| isExpanded | 
                         Indicates whether or not the group row is expanded. Available if rowType is "group".  | 
                |
| isNewRow | 
                         Indicates that the row is added, but not yet saved.  | 
                |
| isSelected | 
                         Indicates whether the row is selected.  | 
                |
| jQueryEvent | 
                             Use 'event' instead. The jQuery event that caused the handler execution. Deprecated in favor of the event field.  | 
                |
| key | any | 
                         The row's key.  | 
                
| model | 
                         The model data. Available only if Knockout is used.  | 
                |
| rowElement | 
                         The row's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| rowIndex | 
                         The row's index. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| values | Array<any>  | 
                    
                         Values displayed in the row cells.  | 
                
Main article: onRowClick
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowCollapsed
Raised after a row is collapsed.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowCollapsed
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowCollapsing
Raised before a row is collapsed.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel row collapsing.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowCollapsing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowDblClick
Raised when a row is double-clicked or double-tapped.
Event
Information about the event that caused the function's execution.
| Name | Type | Description | 
|---|---|---|
| columns | 
                         The configurations of visible columns.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The row's data.  | 
                |
| element | 
                         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.  | 
                
| groupIndex | 
                         The row's group index. Available if rowType is "group".  | 
                |
| isExpanded | 
                         Indicates whether the row is expanded or collapsed. Available if rowType is "data", "detail", or "group".  | 
                |
| isNewRow | 
                         Indicates that the row is added, but not yet saved.  | 
                |
| isSelected | 
                         Indicates whether the row is selected. Available if rowType is "data" or "detail".  | 
                |
| key | any | 
                         The row's key or a group row's key. Available if the rowType is "data", "detail", "detailAdaptive", or "group".  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| rowElement | 
                         The row's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| rowIndex | 
                         The row's index. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| values | Array<any>  | 
                    
                         Raw values displayed in the row's cells.  | 
                
Main article: onRowDblClick
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowExpanded
Raised after a row is expanded.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowExpanded
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowExpanding
Raised before a row is expanded.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | 
                         Allows you to cancel row expansion.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| element | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowExpanding
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowInserted
Raised after a new row has been inserted into the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| error | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowInserted
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowInserting
Raised before a new row is inserted into the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | | | 
                         true, a Promise resolved with true, or a rejected Promise stops row insertion.  | 
                
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row that should be inserted.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowInserting
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowPrepared
Raised after a row is created.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| columns | 
                         All column configurations.  | 
                |
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The row's raw data. Unavailable if rowType is "header", "filter" or "totalFooter".  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| groupIndex | 
                         The row's group index. Available if rowType is "group".  | 
                |
| isExpanded | 
                         Indicates whether the row is expanded or collapsed. Unavailable if rowType is "header", "filter", or "totalFooter".  | 
                |
| isNewRow | 
                         Indicates that the row is added, but not yet saved.  | 
                |
| isSelected | 
                         Indicates whether the prepared row is selected. Available only if rowType is "data".  | 
                |
| key | any | 
                         The row's key.  | 
                
| model | 
                         The model data. Available only if Knockout is used.  | 
                |
| rowElement | 
                         The row's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| rowIndex | 
                         The row's index. Refer to Column and Row Indexes for more information.  | 
                |
| rowType | 
                         The row's type.  | 
                |
| values | Array<any>  | 
                    
                         Values displayed in the row cells.  | 
                
Main article: onRowPrepared
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowRemoved
Raised after a row has been removed from the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| error | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowRemoved
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowRemoving
Raised before a row is removed from the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | | | 
                         true, a Promise resolved with true, or a rejected Promise stops row removal.  | 
                
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The data of the row that should be removed.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| key | any | 
                         The row's key.  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowRemoving
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowUpdated
Raised after a row has been updated in the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| data | 
                         The updated data of the row.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| error | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                
Main article: onRowUpdated
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowUpdating
Raised before a row is updated in the data source.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| cancel | | | 
                         true, a Promise resolved with true, or a rejected Promise stops row updating.  | 
                
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| key | any | 
                         The row's key.  | 
                
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| newData | 
                         The row's updated data.  | 
                |
| oldData | 
                         The row's old data.  | 
                
Main article: onRowUpdating
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
rowValidating
Raised after cells in a row are validated against validation rules.
Event
Information about the event.
| 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 | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| errorText | 
                         An error message to be displayed.  | 
                |
| isValid | 
                         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 | 
                         The model data. Available only if you use Knockout.  | 
                |
| newData | 
                         The data of the validated row after changes.  | 
                |
| oldData | 
                         The data of the validated row before changes.  | 
                
Main article: onRowValidating
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
selectionChanged
Raised after selecting a row or clearing its selection.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         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 | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| selectedRowKeys | Array<any>  | 
                    
                         The keys of all selected rows.  | 
                
| selectedRowsData | 
                         The data of all selected rows.  | 
                
Main article: onSelectionChanged
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
toolbarPreparing
Raised before the toolbar is created.
Event
Information about the event.
| Name | Type | Description | 
|---|---|---|
| component | 
                         The widget's instance.  | 
                |
| element | 
                         The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.  | 
                |
| model | 
                         The model data. Available only if you use Knockout.  | 
                |
| toolbarOptions | 
Main article: onToolbarPreparing
See Also
- Handle Events: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
 
If you have technical questions, please create a support ticket in the DevExpress Support Center.