Components / TreeView / API / DragAndDropDirective / 
New to Kendo UI for Angular? Start a free 30-day trial

DragAndDropDirective

A directive which enables the dragging and dropping items inside the current TreeView or between multiple linked TreeView component instances (see example).

Triggers the nodeDragStart, nodeDrag, nodeDrop, nodeDragEnd, addItem and removeItem events when the corresponding actions occur on the respective TreeView instance.

Selector

[kendoTreeViewDragAndDrop]

Inputs

NameTypeDefaultDescription

allowCopy

boolean

false

Specifies whether the removeItem event will be fired after an item is dropped when the ctrl key is pressed. If enabled, the removeItem event will not be fired on the source TreeView (see example).

autoScroll

boolean | DragAndDropScrollSettings

true

Controlls the auto-scrolling behavior during drag-and-drop (see example). Enbaled by default. To turn the auto-scrolling off, set this prop to false.

By default, the scrolling will be performed by 1 pixel at every 1 millisecond, when the dragged item reaches the top or the bottom of the scrollable container. The step and interval can be overridden by providing a DragAndDropScrollSettings object to this prop.

dropZoneTreeViews

TreeViewComponent[]

Specifes the TreeViewComponent instances into which dragged items from the current TreeViewComponent can be dropped (see example).

startDragAfter

number

5

Specifies the distance in pixels from the initial item pointerdown event, before the dragging is initiated. The nodeDragStart and all consequent TreeView drag events will not be fired until the actual dragging begins.

In this article

Not finding the help you need?

Contact Support