Home Reference Source
public class | source

Sortable

Extends:

* → Sortable

Sortable is built on top of Draggable and allows sorting of draggable elements. Sortable will keep track of the original index and emits the new index as you drag over draggable elements.

Constructor Summary

Public Constructor
public

constructor(containers: HTMLElement[] | NodeList | HTMLElement, options: Object)

Sortable constructor.

Member Summary

Public Members
public

startContainer: HTMLElement

start container on drag start

public

start index of source on drag start

Method Summary

Public Methods
public

Destroys Sortable instance.

public

index(element: HTMLElement): Number

Returns true index of element within its container during drag operation, i.e.

Private Methods
private

Drag over container handler

private

Drag over handler

private

Drag start handler

private

Drag stop handler

Public Constructors

public constructor(containers: HTMLElement[] | NodeList | HTMLElement, options: Object) source

Sortable constructor.

Params:

NameTypeAttributeDescription
containers HTMLElement[] | NodeList | HTMLElement

Sortable containers

options Object

Options for Sortable

Public Members

public startContainer: HTMLElement source

start container on drag start

Properties:

NameTypeAttributeDescription
startContainer *

public startIndex: Number source

start index of source on drag start

Properties:

NameTypeAttributeDescription
startIndex *

Public Methods

public destroy() source

Destroys Sortable instance.

public index(element: HTMLElement): Number source

Returns true index of element within its container during drag operation, i.e. excluding mirror and original source

Params:

NameTypeAttributeDescription
element HTMLElement

An element

Return:

Number

Private Methods

private [onDragOverContainer](event: DragOverContainerEvent) source

Drag over container handler

Params:

NameTypeAttributeDescription
event DragOverContainerEvent

Drag over container event

private [onDragOver](event: DragOverEvent) source

Drag over handler

Params:

NameTypeAttributeDescription
event DragOverEvent

Drag over event

private [onDragStart](event: DragStartEvent) source

Drag start handler

Params:

NameTypeAttributeDescription
event DragStartEvent

Drag start event

private [onDragStop](event: DragStopEvent) source

Drag stop handler

Params:

NameTypeAttributeDescription
event DragStopEvent

Drag stop event