How do I implement drag and drop between a KendoReact Grid and a TreeList?

[Sean]

Hi all, 

I need to add the capability to drag something from a Grid to a TreeList.

As far as my research has taken me, this is not available out of the box.

Can anybody advise me on strategies to make this work?

Thanks!

Sean P

[Konstantin Dikov]

Hello Sean,

Although that there is no built-in functionality for Drag&Drop between Grid and TreeList, you can use the following examples that show how to make Grid rows draggable, how to store the currently dragged item and how to handle the drop target element:

• https://www.telerik.com/kendo-react-ui/knowledge-base/grid-scheduler-drag-and-drop/
• https://www.telerik.com/kendo-react-ui/components/grid/rows/row-reordering/

As for the TreeList, you can handle the "rowRender" to add an attribute with the ID of the data items to the TR element for example, so that you can use that ID to easily identify over which TreeList item the drop event had occurred:

• https://www.telerik.com/kendo-react-ui/components/treelist/api/TreeListProps/#toc-rowrender

Let me know if any questions arise during the implementation. 

 

Best Regards,
Konstantin Dikov
Progress Telerik