kendo drag and drop grid to treeview nodes

Question

I have a kendo grid and a kendo treeview. I want to drag from kendo grid row and add it to my kendo treeview. The only thing is that I want to know the id of the drop target (the exact child of the tree). I don't want to append it in the end of the treeview. How can I do this?

$("#table_messages").kendoDraggable({
  filter: "tr",
  group: "Grid",
  hint: function (e) {
    var item = $("<img src="images/inbox.png"/>");
    return item;
  }
});

$("#folders").kendoDropTarget({
  filter: ".k-item",
  group: "Grid",
  drop: function(e) {

  }
});

Mohsen Bandamir Mohsen Bandamir · Accepted Answer · 2017-01-01T04:44:12

**This Work For Me:

Step1: Add this template for treeview:**

<script id="treeview-template" type="text/kendo-ui-template">
        <div style="display: inline-block">
          <span class="node" id="#: item.id #">#: item.Title #</span>
        </div>

Step2:

$("#folders").kendoDropTarget({

    drop: function (e) { //apply changes to the data after an item is dropped

        dataitem = $("#grid").data("kendoGrid")).dataItem(draggedElement);

        var id = treeview.dataItem($(e.dropTarget).find("span.k-in.k-state-hover").find("span.node")).ID;// id of the drop target

kendo drag and drop grid to treeview nodes

1 Answers