We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Specific drag and drop permissions

When you have a (mvc) treeview, you can hook up some drag and drop events, but how you can check if a specific node can be dragged or dropped based om custom criteria? And when a node is dropped, but is not allowed to be dropped on a specific node, how can revert the result?

1 Reply

SP Sunil Prabakar C Syncfusion Team September 11, 2013 07:38 AM UTC

Hi Lennart,

Thanks for using Syncfusion products.


Regarding Query 1: Checked a specific node can be dragged or dropped.


When the “DragandDrop” property of TreeView control is set as true all the nodes of the TreeView control is rendered with the class “ui-droppable” and “ui-draggable”.

So we suggest you to use the class “ui-droppable” and “ui-draggable” to check if  a node can be dragged or dropped. Kindly refer the following code snippet.




function NodeCLick(sender,args) {

if ($("#" + args._id).hasClass('ui-droppable'))








Regarding Query 2: When node is dropped on specific node need to revert the result.

To prevent the node dropping, when the node try to drop on specific node, you can use the “ClientSideOnDropping” clientside event and “set_DropChild()” ClientSide API of TreeView control.

Here we prevent the node dropping based on node id. Please refer the following code snippet.




function onDropping(sender,args) {

if ($(args._target).parents('li:first').attr('id') == "li12")






For your convenience we have prepared a sample to exhibit this behavior and it is available in the following link.


Kindly let us know if you have any other queries.


Sunil Prabakar C

Live Chat Icon For mobile
Up arrow icon