TreeView for DevExtreme - How to drag and drop multiple items

This example demonstrates how to implement the Drag and Drop functionality for multiple selected items in TreeView. It contains implementations for both plain and hierarchical data structures.

Use the following demos if you want to implement Drag and Drop of single items:

TreeView - Drag & Drop for Plain Data Structure

TreeView - Drag & Drop for Hierarchical Data Structure

Implementation Details

TreeView doesn't have a built-in Drag and Drop functionality. This example is based on the DevExtreme Sortable component, which adds the capability of reordering items.

Files to Review

• Angular
  • app.component.html
  • app.component.ts
  • tree-view-hierarchy.component.html
  • tree-view-hierarchy.component.ts
  • tree-view-plain.component.html
  • tree-view-plain.component.ts
• jQuery
  • index.js
  • treeView-hierarchy.js
  • treeView-plain.js
• React
  • App.tsx
  • TreeViewHierarchy.tsx
  • TreeViewPlain.tsx
• Vue
  • HomeContent.vue
  • TreeViewHierarchy.vue
  • TreeViewPlain.vue
• ASP.Net Core
  • Index.cshtml
  • TreeViewHierarchy.cshtml
  • TreeViewPlain.cshtml

Documentation

• Getting Started with TreeView

• TreeView - API Reference

More Examples

• DataGrid for DevExtreme - How to drag multiple rows
• DataGrid for DevExtreme - How to drag multiple rows between two grids

Does This Example Address Your Development Requirements/Objectives?

(you will be redirected to DevExpress.com to submit your response)