Row Drag
You can drag rows and reorder rows in the Grid. The following properties should be set to enable row dragging.
behavior: {
allowRowReorder: true
},
appearance: {
showRowHeader: true,
showRowHeaderDragIcon: true
}
The 'rowDragStart', 'rowDragging', 'rowDragEnd' and 'rowReorder' events occur during the drag and drop process.
The following example shows how to implement drag and drop of rows between two Grid instances.
For AI tooling
Developer Quick Reference
Topic: grid-row-reorder Component: Grid Framework: JavaScript
Main methods: (none detected)
Common config keys: behavior, appearance
Implementation Notes
Compatibility: Modern browsers / Web Components API access pattern: const component = document.querySelector(...) + component.method()
Lifecycle guidance: Initialize configuration first, then invoke imperative API when element is available in DOM.
Common pitfalls:
- Calling methods before element initialization.
- Reassigning large configuration partially without understanding merge behavior.
- Missing required module script import for component type.
Validation checklist:
- Ensure module scripts and CSS are loaded once.
- Keep data schema aligned with columns/series definitions.
- Verify method calls target initialized component instance.