Maintain scroll position of radtreeview on redirect

8 posts, 0 answers
  1. Sidney
    Sidney avatar
    2 posts
    Member since:
    Jun 2008

    Posted 12 Jun 2008 Link to this post

    I am using a radtreeview for navigation on my site.  When any particular node is clicked you will be redirected to the appropriate page.  The tree is located on a master page and therefore you can jump to any page from any other page.  The tree maintains the current expanded nodes when redirecting, however, I would also like it to maintain the current scroll position of the tree.  I was hoping you would have a suggestion as to how this can be accomplished.
  2. Peter Zolja
    Peter Zolja avatar
    119 posts
    Member since:
    Dec 2007
  3. Sidney
    Sidney avatar
    2 posts
    Member since:
    Jun 2008

    Posted 12 Jun 2008 Link to this post

    I appreciate you taking the time to help, however, that did not seem to have any effect on the current behavior of my tree.  Any other suggestions?

  4. Peter Zolja
    Peter Zolja avatar
    119 posts
    Member since:
    Dec 2007

    Posted 12 Jun 2008 Link to this post

    My bad; that link was for the non-AJAX version. The link for the AJAX version is this one:

    http://www.telerik.com/help/aspnet-ajax/tree_nodescrolling.html

    However, I tried that example and it didn't work for me. Here's what I tried:

    <body onload="setTimeout('ScrollToLastNode()', 500);">  
            
        <script language="javascript">  
          function ScrollToLastNode()  
          {  
               var treeviewInstance = $find("<%=r.ClientID %>");  
               // search for the last node; this node should be out of view             
               var lastNode = treeviewInstance.findNodeByValue("59");   
               if (lastNode != null)  
               {  
                  window.setTimeout(function() { lastNode.scrollIntoView(); }, 200);  
               }  
          }  
        </script>    
     
        <form id="form1" runat="server">  
          <asp:ScriptManager runat="server" ID="sm"></asp:ScriptManager> 
          <telerik:RadTreeView runat="server" ID="r">                
            <Nodes> 
              <telerik:RadTreeNode Value="0" Text="0" /> 
              <telerik:RadTreeNode Value="1" Text="1" /> 
              <telerik:RadTreeNode Value="2" Text="2" /> 
              <telerik:RadTreeNode Value="3" Text="3" /> 
              <telerik:RadTreeNode Value="4" Text="4" /> 
              <telerik:RadTreeNode Value="5" Text="5" /> 
              <telerik:RadTreeNode Value="6" Text="6" /> 
              <telerik:RadTreeNode Value="7" Text="7" /> 
              <telerik:RadTreeNode Value="8" Text="8" /> 
              <telerik:RadTreeNode Value="9" Text="9" /> 
              <telerik:RadTreeNode Value="10" Text="10" /> 
              <telerik:RadTreeNode Value="11" Text="11" /> 
              <telerik:RadTreeNode Value="12" Text="12" /> 
              <telerik:RadTreeNode Value="13" Text="13" /> 
              <telerik:RadTreeNode Value="14" Text="14" /> 
              <telerik:RadTreeNode Value="15" Text="15" /> 
              <telerik:RadTreeNode Value="16" Text="16" /> 
              <telerik:RadTreeNode Value="17" Text="17" /> 
              <telerik:RadTreeNode Value="18" Text="18" /> 
              <telerik:RadTreeNode Value="19" Text="19" /> 
              <telerik:RadTreeNode Value="20" Text="20" /> 
              <telerik:RadTreeNode Value="21" Text="21" /> 
              <telerik:RadTreeNode Value="22" Text="22" /> 
              <telerik:RadTreeNode Value="23" Text="23" /> 
              <telerik:RadTreeNode Value="24" Text="24" /> 
              <telerik:RadTreeNode Value="25" Text="25" /> 
              <telerik:RadTreeNode Value="26" Text="26" /> 
              <telerik:RadTreeNode Value="27" Text="27" /> 
              <telerik:RadTreeNode Value="28" Text="28" /> 
              <telerik:RadTreeNode Value="29" Text="29" /> 
              <telerik:RadTreeNode Value="30" Text="30" /> 
              <telerik:RadTreeNode Value="31" Text="31" /> 
              <telerik:RadTreeNode Value="32" Text="32" /> 
              <telerik:RadTreeNode Value="33" Text="33" /> 
              <telerik:RadTreeNode Value="34" Text="34" /> 
              <telerik:RadTreeNode Value="35" Text="35" /> 
              <telerik:RadTreeNode Value="36" Text="36" /> 
              <telerik:RadTreeNode Value="37" Text="37" /> 
              <telerik:RadTreeNode Value="38" Text="38" /> 
              <telerik:RadTreeNode Value="39" Text="39" /> 
              <telerik:RadTreeNode Value="40" Text="40" /> 
              <telerik:RadTreeNode Value="41" Text="41" /> 
              <telerik:RadTreeNode Value="42" Text="42" /> 
              <telerik:RadTreeNode Value="43" Text="43" /> 
              <telerik:RadTreeNode Value="44" Text="44" /> 
              <telerik:RadTreeNode Value="45" Text="45" /> 
              <telerik:RadTreeNode Value="46" Text="46" /> 
              <telerik:RadTreeNode Value="47" Text="47" /> 
              <telerik:RadTreeNode Value="48" Text="48" /> 
              <telerik:RadTreeNode Value="49" Text="49" /> 
              <telerik:RadTreeNode Value="50" Text="50" /> 
              <telerik:RadTreeNode Value="51" Text="51" /> 
              <telerik:RadTreeNode Value="52" Text="52" /> 
              <telerik:RadTreeNode Value="53" Text="53" /> 
              <telerik:RadTreeNode Value="54" Text="54" /> 
              <telerik:RadTreeNode Value="55" Text="55" /> 
              <telerik:RadTreeNode Value="56" Text="56" /> 
              <telerik:RadTreeNode Value="57" Text="57" /> 
              <telerik:RadTreeNode Value="58" Text="58" /> 
              <telerik:RadTreeNode Value="59" Text="59" /> 
            </Nodes> 
          </telerik:RadTreeView>   
        </form> 
    </body> 

    The scrollIntoView call doesn't make a difference in this case, though it should (IMO)...

    Peter.
  5. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 13 Jun 2008 Link to this post

    Hello Peter Zolja,

    You can try the following:

    1. Rename the ScrollToLastNode() function to pageLoad()
    2. Remove the onload="setTimeout('ScrollToLastNode()', 500);" from the <body > element


    I hope this helps.

    Greetings,
    Veskoni
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. Peter Zolja
    Peter Zolja avatar
    119 posts
    Member since:
    Dec 2007

    Posted 13 Jun 2008 Link to this post

    Nope, sorry... That didn't make a difference.  I can put an alert right before calling scrollIntoView, so I know that it gets there, but calling scrollIntoView doesn't do anything. I tried with IE7 and FF3, no effect in either of the two.
  7. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 17 Jun 2008 Link to this post

    Hello Peter,

    Actually in order the scrollIntoView() method to work - you need to set the Height property of the treeview, so the scrollbar appears on the treeview, not on the page.

    I hope this helps.

    Regards,
    Veskoni
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  8. Christian
    Christian avatar
    37 posts
    Member since:
    Oct 2007

    Posted 08 Apr 2009 Link to this post

    Hi,
    is it possible to set the TreeView's Height in Javascript like this?

    node.select(); 
    node.get_treeView().height = $get('ParentPanel').offsetHeight; 
    node.scrollIntoView(); 

    Where the ParentPanel is the Panel surrounding the TreeView.

    But this doesn't work for me.

    Thanks
    Christian
Back to Top