Moving tree view nodes and implementing context menu

[Joe]

Does any one have any good resources or examples of how to determine the ordinal position (indexof) of child nodes in the controller via a Ajax call?  I am able to pass the tree data by returning the results of treeview.getTreeData(), but not determine the changes of the sort order.

I am also trying to implement a context menu.  A google search returns https://ej2.syncfusion.com/aspnetcore/documentation/treeview/how-to/ but will not load.  

I am new to Syncfusion, while the extensions appear provide all the features I am looking for, the documentation is difficult to find.  Are there any resources that someone has found which has good implementation examples.  Currently, I rely on intellisense for building the controllers and views but am struggling with client side scripts.

[Christopher Issac Sunder K]

Hi Joe, 

Greetings from Syncfusion support. 

Query-1: how to determine the ordinal position (indexof) of child nodes in the controller via a Ajax call 

Can you please let us know whether you would like to access the sorted child node index in the server side? 

 

Query-2: A google search returns https://ej2.syncfusion.com/aspnetcore/documentation/treeview/how-to/ but will not load. 

Please refer the following link: https://ej2.syncfusion.com/aspnetmvc/documentation/treeview/getting-started/ 

 

Query-3: Trying to implement context menu. Need proper documentation 

https://ej2.syncfusion.com/aspnetmvc/documentation/treeview/how-to/process-the-tree-node-operations-using-context-menu/ 

Please let us know if you have any concerns. 

Thanks, 

Christo 

[Joe]

Yes, I need the sort order so that the database can be updated with the order that the nodes have been dragged.

[Mohan Ravi]

Hi Joe, 

You can get the sort data or modified data of where the data has been placed when a particular node has been dragged and dropped in to a node by listening to the “nodeDropped” event of treeview, which will emit the current data node and dropped target, its index etc. 

Live sample: https://stackblitz.com/edit/ndi52k-as8pnz?file=index.ts 

API Documentation: https://ej2.syncfusion.com/documentation/api/treeview#nodedropped 

Regards, 

Mohan 

[Joe]

Can you please provide a complete Visual Studio project with the view, viewmodel and controller demonstrating the updated list of objects with an ordinal position as one of the properties of the nodes returned to the controller?

[Christopher Issac Sunder K]

Hi Joe, 

 

We have prepared a sample based on your requirement. You can get the ordinal index of child items of droppedNode in the nodeDropped event by using following code block. 

 

function onNodeDrop(args) { 

    var element = args.droppedNode; 

    // Gets the child Element of the dropped node 

    var liElements = element.querySelectorAll('ul li'); 

    var arr = []; 

    for (var i = 0; i < liElements.length; i++) { 

        var nodeData = this.getNode(liElements[i]); 

        arr.push(nodeData); 

 

    } 

    console.log(arr); 

    $.post("/Home/UpdatedData/", { 

        data: arr 

    }, function (child) { 

        alert(`${child} child items received by the server`) 

    }); 

} 

 

Sample: http://www.syncfusion.com/downloads/support/forum/144275/ze/WebApplication11705927356 

 

Please check the above sample and get back to us if you need any further assistance. 

 

Thanks,
Christo