New to Kendo UI for Angular? Start a free 30-day trial

Drag Target

The DragTarget directive allows you to transform any HTML element or Angular component into a draggable unit. Afterwards the user can change it's position via drag and drop.

When an element is configured as DragTarget, it will emit the following events upon user interaction:

  • onPress—Fires when the drag target is pressed.
  • onRelease—Fires when the drag target is released after being pressed.
  • onDragReady—Fires when the dragDelay has passed and the user is able to drag the element.
  • onDragStart—Fires when the dragging of the element begins.
  • onDrag—Fires while the element is being dragged.
  • onDragEnd—Fires when the dragging of the element ends and the user releases it.

The following example demonstrates the DragTarget directive in action.

View Source
Change Theme:

In this article

Not finding the help you need?