Getting kendo Treeview to Copy node on drag and drop

Question

I have two treeviews side by side populated from a server-side source.
The left treeview contains permissions that are grouped. The right treeview contains persons.

I've set up rules in the drop events to prevent a user from dragging anything but a permission to anything but a person:

 $("#tvw-permissions").kendoTreeView({
            dragAndDrop: true,
            dataSource: permissiondatasource,
            dataTextField: ["Text"],
            dataSpriteCssClassField: ["SpriteCssClass"],
            drop: function (e) {
                var srcTree = $($(e.sourceNode).closest("div.k-treeview")).data("kendoTreeView").element[0].id;
                var destTree = $($(e.destinationNode).closest("div.k-treeview")).data("kendoTreeView").element[0].id;

                if (srcTree == destTree) {
                    e.setValid(false);

                }

                var destinationid = $('#' + destTree).data("kendoTreeView").dataSource
                    .getByUid($(e.destinationNode).data("uid")).id;

                if (!destinationid.startsWith('person')) {
                    e.setValid(false);
                    return;
                }
            }

So far so good. I do however want to be able to drag the same permission to multiple people. The Kendo Treeview does a 'move node' on the drag-drop operation.

How do I get to keep the dragged node on the source tree from being moved?

callisto callisto · Accepted Answer · 2018-07-04T06:58:10

SOLUTION: I got this to work by first cancelling the drop action, and then manually adding a copy of the sourceNode to the Destination treeview:

 $("#tvw-permissions").kendoTreeView({
     dragAndDrop: true,
     dataSource: permissiondatasource,    
     drop: function (e) {
       e.preventDefault();
       var treeview = $("#tvwPersons").data("kendoTreeView");
       var copy = this.dataItem(e.sourceNode).toJSON();
       treeview.append(copy, $(e.destinationNode));
       return;
    }

Getting kendo Treeview to Copy node on drag and drop

1 Answers