Restore tree state after refresh

3 posts, 0 answers
  1. Keijo
    Keijo avatar
    4 posts
    Member since:
    Nov 2016

    Posted 16 Jun Link to this post

    I have a treelist bound to server data that i need to open to the same branch after refresh.

    The refresh is done with a separate button that reloads the data from the database, and returns the path to the last selected tree node as list of the node's id's. Problem is that the tree is set to load data only when needed, so the loop this function runs attempting to expand the tree works too fast, and tries to expand nodes that the tree hasn't loaded yet.

    Function code is following

    function onRefreshClick() {
                var treelist = $("#treelist").data("kendoTreeList");
     
                treelist.dataSource.read();
                 
               $.ajax({
                    type: "POST",
                    url: '@Url.Action("GetTreePath", "Tree")',
                    data: { itemID: currentID },
                    success: function (data) {
                        var dataArray = $.map(data, function (el) { return el });
     
                        for (i = 0; i < dataArray.length; i++) {
                            var rows = treelist.content.find("tr:visible");
                            var found = false;
                            for (var iRow = 0; iRow < rows.length; iRow++) {
                                if (found) {
                                    break;
                                }
                                row = rows[iRow];
                                var cellI = 0;
                                if (row != undefined) {
                                    while (row.cells[cellI] != undefined) {
                                        if (row.cells[cellI].innerText == dataArray[i]) {
     
                                            treelist.expand(row);
     
                                            alert("Opening tree");
     
                                            found = true;
                                            break;
                                        }
     
                                        cellI++;
                                    }
                                }
                            }
                             
                        }
                    }
                });
            }

    The above works if the user dismisses the "opening tree" alert after the tree has loaded and opened the tree branch, but is it possible to make the function wait for the data to be loaded without manual control, or is there some other way to perform this function?

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1969 posts

    Posted 20 Jun Link to this post

    Hello Keijo,

    Have you tried to use the dataBound event of the Kendo UI TreeList in order to expand each level of the treelist until you reach to the specific node? The dataBound event is fired once the data is loaded successfully and it should work fine. 

    Regards,
    Boyan Dimitrov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Keijo
    Keijo avatar
    4 posts
    Member since:
    Nov 2016

    Posted 20 Jun Link to this post

    Hello Boyan Dimitrov,

     

    Thank you for the help using dataBound solved my issue. now it works as I save path in the button press and then do the main expand in the dataBound. 

Back to Top