Auto-Collapse & Folder Visibility for the selected folder

2 posts, 0 answers
  1. Vineeth
    Vineeth avatar
    1 posts
    Member since:
    Oct 2010

    Posted 08 Oct 2010 Link to this post



    I am working on a web application using Telerik FileExplorer with custom implementation as explained here, as I had to point the application to physical and Shared paths  for browsing a set of folders from A-Z , which includes numerous sub-folders and files (refer attached Screenshot1.JPG). Each folder holds the subfolders starting with the Root folder name (A-Z)… for e.g. Folder A contains subfolders AGGH, AJJJ,AYYY etc Folder B contains subfolders BSSS,BHHHE,BYUU etc. Following is the tree view structure:



     --- Folder A

                    ---Sub Folder AGGH

                    ---Sub Folder AJJJ

                    ---Sub Folder AYYY


    --- Folder B

                    ---Sub Folder BSSS

                    ---Sub Folder BHHHE

                    ---Sub Folder BYUU



    I also have a lookup text box to search for a sub folder (e.g. AGGH,BYUU etc) and based on the input in the textbox, the Sub folder would be auto-selected. My requirements are:


    1. whenever I do a search it should collapse all the sub-folders and folders which was expanded on a previous search (if any). i.e. The only sub-folder that would be expanded would be the one I’ve searched.
    1. As there are numerous sub-folders in each folder, while expanding the sub-folder through search, I need to scroll all the way down to see the folder selected. Is there a way to make the currently selected Folder visible? (Please refer the attached screenshots. Currently when I search for ZUKAN which is under folder Z, I see the screen as in Screenshot2.JPG.. I would like to see it as in Screenshot3.JPG).


    Thanks for your quick response.


  2. Fiko
    Fiko avatar
    1406 posts

    Posted 14 Oct 2010 Link to this post

    Hi Vineeth,

    When the search button is clicked you can set the RadFileExplorer's InitialPath property to point to the folder which is found (as a result of the search). In this case it will be automatically selected. You can use OnClientLoad event of the RadFileExplorer control in order to collapse the nodes. Your code should be similar to this one:
    function OnClientLoad(oExplorer, args)
        var tree = oExplorer.get_tree();
        colapsenodes(tree, oExplorer.get_currentDirectory());
    function colapsenodes(oTree, selectedDirectoryPath)
        var allTreeNodes = oTree.get_allNodes();
        for (var i = 0; i < allTreeNodes.length; i++)
            var currentNode = allTreeNodes[i];
            if (!selectedDirectoryPath.startsWith(currentNode.get_value()))

    Please note the scrollIntoView() method, which scrolls the TreeView in order to show the selected node.

    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft R3 2016 release webinar banner
Back to Top