[Solved] How to move the scroll bar to the original position

[Hemangajit Dutta]

Hello,
            I am using the Telerik treeview control. The tree view contains many nodes and vertically scrollable. Here we can add or delete a node by right clikcing on a context menu on the desired node or check a node. However the addition, deletion and checking operation requires postback and after each postback the treeview scrolls to the top and the users are facing usabilty issue because of this. Is there a way I can move the scroll bar to the node on which I clicked on the context menu or the node which I checked.

Thanks
Hemangajit

[Hemangajit Dutta]

Hello,
           I am trying with the follwoing code snippet in the Node_Check event

            string script = "Sys.Application.add_load(function(){var tree = $find('" + trTaxonomy.ClientID + "');";
            script += "var node = tree.findNodeByValue('" + e.Node.Value + "'); node.scrollIntoView();});";

            ScriptManager.RegisterStartupScript(Page, Page.GetType(), "scroll", script, true);

Also I set the height property of the treeview. But still its not working.

Can someone please help?

Thanks and Regards
Hemangajit

[Veselin Vasilev]

Hello Hemangajit Dutta,

The approach and code seems correct. Do you receive any errors?
Can you put an alert to see if the js code executes and finds the node?

If it finds it, then you might need to use the setTimeout function before calling the scrollIntoView() method:

setTimeout(function(){ node.scrollIntoView(); }, 200);

Hope this helps.

Greetings,
Veselin Vasilev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Hemangajit Dutta]

Hi Veselin,
                     Thanks. I tried setting the time out and also setting an laert to capture the node. The alert shows the object. But still the scrollbar is not going to the appropriate position. Here is the code snippet I am using now.


            string script = "Sys.Application.add_load(function(){var tree = $find('" + trTaxonomy.ClientID + "');";
            script += "var node = tree.findNodeByValue('" + e.Node.Value + "'); alert(node); setTimeout(function(){ node.scrollIntoView(); }, 1000); node.scrollIntoView();});";
            ScriptManager.RegisterStartupScript(Page, Page.GetType(), "scroll", script, true);

I am using a treeview in a small pop up page opened in a rad window. Does it have to do anything?

Thanks and Regards
Hamnagjit

[Veselin Vasilev]

Hi Hemangajit Dutta,

I already replied to your ticket:

In order the scrollIntoView() method to work you need to set the Height property of the treeview (this is described here):

<telerik:RadTreeView runat="server" ID="trTaxonomy" onnodecheck="Unnamed1_NodeCheck"
    onnodeexpand="Unnamed1_NodeExpand" CheckBoxes="true" Height="320px">

It all works now.

Kind regards,
Veselin Vasilev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.