Events

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onChange option to handle the event.

closed

Fires after a drop-down list has been hidden.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

Instead, you can use the onClosed option to handle the event.

contentReady

Raised when the widget's content is ready.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

copy

Fires after the widget's input has been copied.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onCopy option to handle the event.

customItemCreating

Raised when a user adds a custom item.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

text:

The input field's text.

customItem:

|

|

Promise<any> (jQuery or native)

The field where to place a custom item.

Return Value:

|

|

Promise<any> (jQuery or native)

A custom item or a Promise that is resolved after the item is created. It is a native Promise or a jQuery.Promise when you use jQuery.

Main article: onCustomItemCreating

cut

Fires after the Cut DOM event has fired.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onCut option to handle the event.

disposing

Raised when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget instance.

element:

Element (jQuery or HTML)

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.

enterKey

Fires after the Enter key has been pressed within the widget's input element.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onEnterKey option to handle the event.

focusIn

Fires after the widget's input has been focused.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Use the on() method to attach a handler for the focusIn event.

To unsubscribe from this event, use the off() method.

Note that you can handle the focusIn event within the widget's configuration object by assigning your handler to the onFocusIn option.

focusOut

Fires after the widget's input element has lost focus.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onFocusOut option to handle the event.

initialized

Raised only once, after the widget is initialized.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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

Main article: onInitialized

input

Fires when a value within the widget's input element is changed by an end user.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onInput option to handle the event.

itemClick

Fires when a widget item is clicked.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

itemData:

The clicked item's data.

itemElement:

The item's container.

itemIndex:

Number

|

The clicked item's index. If the widget items are grouped, the index represents an object defining the group and item indexes: { group: 0, item: 0 }.

Instead, you can use the onItemClick option to handle the event.

keyDown

Fires when a key is pressed down within the widget's input element.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onKeyDown option to handle the event.

keyPress

Fires when the keypress DOM event has been raised for the current input element.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onKeyPress option to handle the event.

keyUp

Fires when a key is released within the widget's input element.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onKeyUp option to handle the event.

multiTagPreparing

Raised before the multi-tag is rendered.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

multiTagElement:

Element (jQuery or HTML)

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

selectedItems:

Array<String | Number | Object>

The currently selected items.

text:

Allows you to change the multi-tag's text.

cancel:

Boolean

Allows you to cancel replacing ordinary tags with the multi-tag.

Main article: onMultiTagPreparing

opened

Fires when the drop-down editor is shown.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

Instead, you can use the onOpened option to handle the event.

optionChanged

Raised after a widget option is changed.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

name:

The option's short name.

fullName:

The option's full name.

value: any

The option's new value.

element:

Element (jQuery or HTML)

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.

paste

Fires after the widget's input has been pasted.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

jQueryEvent:

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Instead, you can use the onPaste option to handle the event.

selectAllValueChanged

Fires when the select all check box value changes.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

value:

Boolean

The "Select All" check box's state.

Instead, you can use the onSelectAllValueChanged option to handle the event.

NOTE

This event fires only if the showSelectionControls option is set to true.

selectionChanged

Fires when the selection changes.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

addedItems:

Array<String | Number | Object>

The data of the items that have been selected.

removedItems:

Array<String | Number | Object>

The data of the items whose selection has been canceled.

Instead, you can use the onSelectionChanged option to handle the event.

valueChanged

Fires when the editor value changes.

Type:

Event

Function parameters:

e:

Information about the event.

Object structure:

component:

The widget's instance.

element:

Element (jQuery or HTML)

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.

value:

Returns the widget's new value.

previousValue:

Returns the widget's previous value.

jQueryEvent: