Scroll node to middle of tree

3 posts, 0 answers
  1. Nir
    Nir avatar
    14 posts
    Member since:
    Dec 2006

    Posted 03 Dec 2008 Link to this post

    Hi,

    I have a tree with many (more than 1000) nodes.

    After finding a node to select I want it to be scrolled to the middle of the tree visible section (when possible...).
    I am using scrollIntoView - but this only gets the node to the bottom section of the tree.

    Is  there a way to set the tree's scrollTop attribute so that the node will be in the middle of the visible tree?

    Thanks, Nir.


  2. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 04 Dec 2008 Link to this post

    Hello Nir,

    There is no built-in way do that. As you have noticed the scrollIntoView method scrolls the node to the bottom of the treeview. You can modify the scrollTop of the treeview div to tweak the scroll position:

    var treeViewElement = treeView.get_element();
    treeViewElement.scrollTop = 200;

    Regards,
    Albert
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. Nir
    Nir avatar
    14 posts
    Member since:
    Dec 2006

    Posted 08 Dec 2008 Link to this post

    Hi,

    I added the following functions to use when I want to scroll the node to the middle of the tree:
    function ScrollSelectedToMiddle(node)  
        var tree = node.get_treeView(); 
        var oDomTree = tree.get_element(); 
        oDomTree.scrollTop = 0; 
        node.scrollIntoView(); 
        var iScrollTop = oDomTree.scrollTop; 
        var posY  = findPosY(node.get_element()); 
        var iHalfOfScreen = parseInt(oDomTree.offsetHeight/2); 
        if (iScrollTop == 0) { 
           oDomTree.scrollTop = parseInt(posY/2); 
        } else { 
            oDomTree.scrollTop += iHalfOfScreen; 
        } 
     
    function findPosY(obj)  
        var curtop = 0; 
        if (obj.offsetParent) { 
            while (obj.offsetParent) { 
                curtop += obj.offsetTop 
                obj = obj.offsetParent; 
            } 
        } else if (obj.y) 
            curtop += obj.y; 
        return curtop; 
    I works well for me.
Back to Top