Basics

Formatting

Context menu

Drag n Drop

Spreadsheet

Tabs

Export (csv, html, pdf, xlsx )

RTL Layout

Layouts

Rows

Paging

Big data

Columns

Cells

Inline editing

Row Grouping

Pivot

Sorting

Filter

Selections

Nesting / Row details

Tree grid

Charts

Angular

React React

Vue Vue

Knockout

;

Drag n drop of rows between grids having row groupings

Rows in any grid with grouped rows can be dragged and dropped to other grids and vice versa.

This is done by:

  • turning on dragModel in draggable grid and dropModel in droppable grid.
  • dragModel.clsDnD and dropModel.accept play crucial role in creating draggable / droppable relation between grids.
  • dragModel.isDraggable is implemented to exclude summary rows and group titles having more than one level of children.
  • dropModel.isDroppable is implemented to exclude summary rows and group titles having more than one level of children.
  • Default implementation of dropModel.drop remove the rows from old grid and add them to new parent in destination grid. You can override it to do custom action upon drop of rows.

Related API:

Drag n drop multiple rows

First of all mutiple row selection is turned on or checkbox selection is turned on.

Then dragModel.dragNodes method is implemented as in this example to return array of selected or checked rows.