在Kendo UI树视图之前和之后限制dropPosotion

Question

When doing drag and drop in Kendo UI TreeView it has 3 positions namely "before", "over" and "after".

http://docs.kendoui.com/api/web/treeview#dragend

Is it possible to restrict the "before" and "after" states and only allow drop "over" functionality.

Note

In my scenario I have 2 trees and I'm dragging element from left tree to the other.

Answer 1

In your kendoTreeView , define drag and drop event handlers as follow:

drag       : function (ev) {
    if (!$(ev.dropTarget).hasClass("k-in k-state-hover")) {
        ev.setStatusClass("k-denied")
    }
},
drop       : function (ev) {
    if (ev.sourceNode === ev.destinationNode) {
        ev.setValid(false);
    }
}

In the drag I check that we are over an element and if not I set that status class to k-denied that it formats the clue as denied but also prevents from dropping it there.

In the drop I just check that I'm not dropping on top of itself preventing a stack overflow.

Running example here: http://jsfiddle.net/OnaBai/mu92b/