The Sortable allows you to disable its items and to move items between two or more Sortable components.
To disable items, use the
disabledIndexes property of the Sortable.
When dragged from the source to the target component, hide the currently active item in the source Sortable through the
display:none inline styles. While the dragging of the item happens, the item is removed from the source component on
dragEnd (mouse up) and added to the target component on
dragOver. As a result, between the
dragEnd and the
dragOver actions and at the same time, in both the source and the target Sortable components two identical items exist. This functionality is handled by the
SortableBindingDirective directive. Custom solutions can be implemented by utlizing the
SortableService and the Sortable's events and methods.
The following example demonstrates how to enable the dragging of items between different item lists.