Events

This section describes events fired by this widget.

change

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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

See Also

closed

Fires after a drop-down list has been hidden.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.

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

See Also
Show Example:
AngularJS
Knockout
jQuery

contentReady

Fires when widget content is ready.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.

If data displayed by the widget is specified using a DataSource instance, the contentReady event fires each time the load() method of the DataSource instance is called as well as when the widget content is ready. In this case, when you create the widget, the contentReady event is raised twice: when the widget's content is ready (at this moment, the widget does not display items) and when the DataSource is loaded (the widget displays the loaded items).

copy

Fires after the widget's input has been copied.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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

See Also

cut

Fires after the Cut DOM event has fired.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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

See Also

disposing

Fires when the widget is being removed.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.

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

See Also
NOTE
This event fires only if the widget is removed using the remove(), empty(), or html() jQuery methods.

enterKey

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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

See Also
Show Example:
AngularJS
Knockout
jQuery

focusIn

Fires after the widget's input has been focused.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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.

See Also
Show Example:
AngularJS
Knockout
jQuery

focusOut

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused action execution.

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

See Also
Show Example:
AngularJS
Knockout
jQuery

initialized

Fires when the widget is initialized.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.

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

See Also

input

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also

itemClick

Fires when a widget item is clicked.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
itemData: Object
The data that is bound to the clicked item.
itemElement: Object
An HTML element of the item.
itemIndex: Number|Object
The index of the clicked item. 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.

See Also
Show Example:
AngularJS
Knockout
jQuery

keyDown

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also

keyPress

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also

keyUp

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

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also

opened

Fires when the drop-down editor is shown.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.

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

See Also
Show Example:
AngularJS
Knockout
jQuery

optionChanged

Fires after an option of the component is changed.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
name: String
Specifies the name of the option whose value is changed.
fullName: String
Specifies a full name of the option whose value is changed. The full name is formed by concatenating the names of the options that are presented in the hierarchy of the given option. The names are delimited by commas.
value: any
Specifies a new value for the option.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.

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

See Also

paste

Fires after the widget's input has been pasted.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also

selectionChanged

Fires when the selection changes.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
selectedItem: Object
Provides access to the currently selected item.

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

See Also

valueChanged

Fires when the editor value changes.

Event Handler Argument:
Provides function parameters.
Object structure:
component: Object
Provides access to the widget instance.
element: jQuery
An HTML element of the widget.
model: Object
Provides access to the data that is available for binding against the element. Available only in the Knockout approach.
value: Object
Returns the widget's new value.
previousValue: Object
Returns the widget's previous value.
jQueryEvent: jQuery.Event
Specifies the jQuery event that caused the action execution.

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

See Also