Class: Draggable

Extends

• html.Box

Type Definitions

html.Draggable.DragEndEvent

A drag-end event.

Properties:

Name	Type	Description
accepted	bool	(default: false) Set to true to accept the event.
original	DragEvent	[readonly] The original HTML5 DragEvent object.

html.Draggable.DragEvent

A drag event.

Use the setData method to add payload data of various types and specify the allowed operations with the effectAllowed property. The drag operation only starts if you set accepted to true.

Properties:

Name	Type	Description
accepted	bool	(default: false) Set to true to accept the event.
effectAllowed	string	(default: "copy") Set to control the allowed drop effect. One of copy|copyLink|copyMove|link|linkMove|all.
original	DragEvent	[readonly] The original HTML5 DragEvent object.
setData	function	Takes two strings type and value for the MIME type and the data contents, respectively.

Events

html.Draggable.event:dragEnd

draggable.js:98

Is triggered when the drag operation has ended.

Note: There is no reliable way in browsers to check if the drag operation ended successfully or was cancelled.

Name	Type	Description
event	html.Draggable.DragEndEvent	The event object.

html.Draggable.event:dragStart

draggable.js:82

Is triggered when a drag operation is being started.

Name	Type	Description
event	html.Draggable.DragEvent	The event object.

Example

onDragStart: ev =>
{
  ev.setData("text/plain", "This is some text.");
  ev.effectAllowed = "copy";
  ev.accepted = true;
}