Question

I am showing the tree view with a datasource but after dragging and dropping there will be changes and I have to get that changed new datasource. How do I do that?

$.ajax({
         type: "POST",
         url: "TestMenu.aspx/GetMenuData",
         contentType: "application/json; charset=utf-8",
         dataType: "json",
         success: function (data) {
         $("#treeview").kendoTreeView({
                 dragAndDrop: true,
                 dataSource: $.parseJSON(data.d)
             });
          }
         });
Was it helpful?

Solution

So, I finally accomplished the task. Posting answer for anyone who's looking for the same answer as I was.
Changed the call to:

       $.ajax({
           type: "POST",
            url: "TestMenu.aspx/GetMenuData",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $("#treeview").kendoTreeView({
                    dragAndDrop: true,
                    dataSource: $.parseJSON(data.d)
                }).data("kendoTreeView");
            }
        });

Then to get the updated data source:

var treeviewDataSource = $("#treeview").data("kendoTreeView").dataSource.view();

OTHER TIPS

We can do with another way:

<div id="treeViewData_Wrapper"></div>
<button onclick="GetNewData()">Get New Data (Refresh kendo TreeView)</button>
<script>
    function FunctionToCreateTreeViewDataSource() {
        // your code here
    }

    function GetNewData() {
        // Clear old treeview html data
        $('#treeViewData_Wrapper').empty();

        // get new treeview html data
        $('<div id="treeViewData"></div>').kendoTreeView({
            dataSource: FunctionToCreateTreeViewDataSource(key, res.data)
        }).appendTo('#treeViewData_Wrapper');
    }
</script>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top