Hi Rafael,
Thanks for using syncfusion products,
We have analyzed your queries and based on your requirement we have prepared the sample and attached it in the following location.
Sample location:
http://www.syncfusion.com/downloads/support/directtrac/120005/TreeViewNodeDragStop-110997717.zip
In this sample, We have separated nodes in Folders and Files, The folder nodes can be able to drag and drop but file nodes only able to drag.
In ClientSideEvent we prevent the drop event for the file nodes by the way of added class “preventDrop” through hmlattributes.
While dragging on those file nodes, icon will be added into minus for the purpose of drop prevent notification.
@Html.EJ().TreeView("drop").ClientSideEvents(e => e.NodeDrag("onNodeDrag").NodeDragStop("onNodeDragStop")).Items(items =>
{
items.Add().Text("Folder1").Expanded(true).Children(child =>
{
child.Add().Text("File 1.1").HtmlAttributes(attr);
child.Add().Text("File 1.2").HtmlAttributes(attr);
});
items.Add().Text("Folder2").Children(child =>
{
child.Add().Text("File 2.1").HtmlAttributes(attr);
child.Add().Text("File 2.2").HtmlAttributes(attr);
});
items.Add().Text("File");
}).AllowDragAndDrop(true)
In this script section
<script>
function onNodeDrag(args) {
if ($(args.target).closest('.e-item').hasClass('preventDrop')) {
$('.e-dropedStatus').removeClass("e-plus").addClass("e-minus");
document.body.style.cursor = 'not-allowed';
}
}
function onNodeDragStop(args) {
if ($(args.target).closest('.e-item').hasClass('preventDrop'))
args.cancel = true;
}
</script>
Please check with the provided sample and let us know if you need further assistance.
To know about the list of properties, methods and events supported by any JS component, go to the online help link for JS (http://helpjs.syncfusion.com/js/overview) and click on the “API reference” section and
navigate to the particular component. For example, to know all the available options in DatePicker check the following link,
http://helpjs.syncfusion.com/js/api/ejdatepicker
For getting started and to know about the important features in any particular component, go to the help link and click on the particular component. For example, getting started and key features in DatePicker can be found in
http://helpjs.syncfusion.com/js/datepicker/overview
Please let us know if you have further queries.
Regards,
Gopal L
Hi Rafael,
Thanks for the update,
Sorry for the inconvenience caused,
Currently we don't have the requested use-case scenario in our documentation, So once we will include those details in our documentation in online and we will let you know the details. We appreciate your patience until then.
Please let us know if you have further queries.
Regards,
Gopal L