[Solved] Drag and Drop but not allow re-order

[Philip Senechal]

I currently have a page with a TreeView and a Grid. The Grid has a div around it that is identified as a drop target for the TreeView. Dragging and dropping works great, however, I would like to prevent the TreeView from re-ordering nodes if someone accidentally drops the node on the TreeView instead of the Grid.

Is there a way to disable node re-ordering (or dropping on the TreeView) and still allow dropping on my target? Thanks.

[Alex Gyoshev]

Hello Philip,

There is a way! To provide the best user experience, attach a handler to the nodeDragging event and set the t-denied status class whenever you want to prevent the drop from happening. In your scenario, it should look like the following:

var treeview = $(".t-treeview")[0];

function onNodeDragging(e) {
    if ($.contains(treeview, e.dropTarget)) {
        e.setStatusClass("t-denied");
    }
}

(It is advisable that the treeview is cached outside of the event handler, in order to minimize the DOM lookups)

Kind regards,
Alex Gyoshev
the Telerik team