CODEWITHSUNDEEP
javascriptjquerykendo-treeview
user2091061
user2091061

Reputation: 877

Scroll to top node of the kendo tree view

I have a scenario where on refreshing a kendo treeView, I need to scroll the view to first item of the tree.

<body>

    <div style="height: 500px; width: 200px; border:1px solid black;" id="tree"></div>
    <div style=" margin:10px; display:block">
        <button style="width:50px; height:20px;" onclick="clickMe()">Click</button>
    </div>

    <script>
        // setup: generate data, select item
        var data = [];
        for (var i = 0; i < 1000; i++) {
            data.push({ text: "Item " + i });
        }
        $("#tree").kendoTreeView({
            dataSource: data
        });

        function clickMe() {
            debugger;
            var treeview = $("#tree").data("kendoTreeView");
            treeview.select(treeview.findByText("Item 500"));

            // scroll to selected item
            var itemScrollTop = treeview.select()[0].offsetTop;
            $("html,body").animate({ scrollTop: itemScrollTop });
        }
    </script>
</body>

I tried doing by using the above code but the problem is it isn't working. If we remove the height of the kendo Treeview div, then it works. But I need to set the height for the tree view.

How can I scroll to top in kendo tree view ?

Upvotes: 1

Views: 1078

Answers (2)

Hardik
Hardik

Reputation: 283

I tried to animate the tree div instead of html and body. Not sure that's what you're looking for.

link: http://dojo.telerik.com/ozite/2

Upvotes: 2

tire0011
tire0011

Reputation: 1058

you have then to select the tree:

$("#tree").animate({ scrollTop: itemScrollTop });

Upvotes: 1

Related Questions