Events

This section describes events raised by the Sortable widget.

See Also

add

Raised when a new item is added.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
component Sortable

The widget that raised the event.

dropInsideItem

Boolean

Indicates if the dragged item is dropped inside another item.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the item's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.

disposing

Raised before the widget is disposed of.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component Sortable

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

Object

Model data. Available only if you use Knockout.

Main article: onDisposing

See Also

dragChange

Raised when the dragged item's position in the list is changed.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
cancel

Boolean

Allows you to cancel the gesture.

component Sortable

The widget that raised the event.

dropInsideItem

Boolean

Indicates if the dragged item is dropped inside another item.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the item's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.

dragEnd

Raised when drag gesture is finished.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
cancel

Boolean

Allows you to cancel the gesture.

component Sortable

The widget that raised the event.

dropInsideItem

Boolean

Indicates if the dragged item is dropped inside another item.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the item's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.

dragMove

Raised every time a draggable item is moved.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
cancel

Boolean

Allows you to cancel the gesture.

component Sortable

The widget that raised the event.

dropInsideItem

Boolean

Indicates if the dragged item is dropped inside another item.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the item's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.

dragStart

Raised when drag gesture is initialized.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
cancel

Boolean

Allows you to cancel the gesture.

component Sortable

The widget that raised the event.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

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 Sortable

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

See Also

optionChanged

Raised after a widget option is changed.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component Sortable

The widget's instance.

fullName

String

The path to the modified option that includes all parent options.

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.

element

Element (jQuery or HTML)

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

model

Object

Model data. Available only if you use Knockout.

Main article: onOptionChanged

See Also

remove

Raised when a draggable item is removed.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
component Sortable

The widget that raised the event.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the roitemw's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.

reorder

Raised when the draggable items are reordered.

Type:

Event

Function parameters:
e:

Object

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

Object structure:
Name Type Description
component Sortable

The widget that raised the event.

dropInsideItem

Boolean

Indicates if the dragged item is dropped inside another item.

element

Element (jQuery or HTML)

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

event

Event (jQuery or dxEvent)

The event that caused the function to execute. It is a dxEvent or a jQuery.Event when you use jQuery.

fromComponent

Sortable

|

Draggable

The instance of the item's source widget.

fromData any

Custom data associated with the source widget.

fromIndex

Number

The item's original position. If the item is dragged from another widget, the value is -1.

itemData any

The dragged item's data.

itemElement

Element (jQuery or HTML)

The container of the item being dragged. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

toComponent

Sortable

|

Draggable

The instance of the item's target widget.

toData any

Custom data associated with the target widget.

toIndex

Number

The position in which the item is placed. If the item is dragged away from the widget, the value is -1.