Change Background Color of Selected Node in FileExplorer TreeView

4 posts, 1 answers
  1. Dean Workman
    Dean Workman avatar
    4 posts
    Member since:
    Oct 2009

    Posted 15 Mar 2010 Link to this post

    I have a FileExplorer control that displays a directory structure in a tree/grid combination.  I have successfully changed the style of the grid so that the selected rows are the color that I want, but I cannot figure out how to change the color of the selected node in the tree.

    Can anyone help me out?
  2. Answer
    Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 17 Mar 2010 Link to this post

    Hi Dean,

    The  CSS selector which corresponds to the RadTreeView's selected node is named .rtSelected .rtIn. In order to change the background you can use the following css class:
    .rtSelected .rtIn
    {
        background-color: lime !important;
        background-image: none !important;
        color: brown !important;
    }

    Please note the !important rule - it should be set to override the default values.

    I hope this helps.

    Sincerely,
    Dobromir
    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. UI for ASP.NET Ajax is Ready for VS 2017
  4. adnan
    adnan avatar
    4 posts
    Member since:
    Nov 2006

    Posted 29 Dec 2010 Link to this post

    is there any way to show any image at right side of selected treenode... ???
  5. Bozhidar
    Admin
    Bozhidar avatar
    677 posts

    Posted 29 Dec 2010 Link to this post

    Hi Dean,

    To show the predefined images form the sprite on the right side, you should overwrite the existing base CSS styles with the following:

    .rfeFileExtension
            {
                background-position: right -681px !important;
            }
             
            td .folder
            {
                background-position: right -1224px !important;
            }
             
            .RadFileExplorer td .folderup
            {
                background-position: right -1256px !important;
            }
             
            .RadFileExplorer td .gif
            {
                background-position: right -39px !important;
            }
             
            .RadFileExplorer td .html, .RadFileExplorer td .htm, .RadFileExplorer td .xhtml, .RadFileExplorer td .hta
            {
                background-position: right -71px !important;
            }
             
            .RadFileExplorer td .exe, .RadFileExplorer td .bat
            {
                background-position: right -967px !important;
            }
             
            .RadFileExplorer td .rar, .RadFileExplorer td .zip, .RadFileExplorer td .ace
            {
                background-position: right -102px !important;
            }
             
            .RadFileExplorer td .psd, .RadFileExplorer td .pdd
            {
                background-position: right -135px !important;
            }
             
            .RadFileExplorer td .js
            {
                background-position: right -167px !important;
            }
             
            .RadFileExplorer td .vbs
            {
                background-position: right -999px !important;
            }
             
            .RadFileExplorer td .css
            {
                background-position: right -200px !important;
            }
             
            .RadFileExplorer td .txt
            {
                background-position: right -232px !important;
            }
             
            .RadFileExplorer td .asp
            {
                background-position: right -264px !important;
            }
             
            .RadFileExplorer td .aspx
            {
                background-position: right -296px !important;
            }
             
            .RadFileExplorer td .sln
            {
                background-position: right -327px !important;
            }
             
            .RadFileExplorer td .config
            {
                background-position: right -360px !important;
            }
             
            .RadFileExplorer td .cs
            {
                background-position: right -392px !important;
            }
             
            .RadFileExplorer td .vb
            {
                background-position: right -424px !important;
            }
             
            .RadFileExplorer td .doc,
            .RadFileExplorer td .docx,
            .RadFileExplorer td .rtf,
            .RadFileExplorer td .dot
            {
                background-position: right -456px !important;
            }
             
            .RadFileExplorer td .ppt,
            .RadFileExplorer td .pptx
            {
                background-position: right -488px !important;
            }
             
            .RadFileExplorer td .xls, .RadFileExplorer td .xlsx
            {
                background-position: right -519px !important;
            }
             
            .RadFileExplorer td .ascx
            {
                background-position: right -550px !important;
            }
             
            .RadFileExplorer td .jpg,
            .RadFileExplorer td .jpeg,
            .RadFileExplorer td .jpe
            {
                background-position: right -584px !important;
            }
             
            .RadFileExplorer td .png
            {
                background-position: right -615px !important;
            }
             
            .RadFileExplorer td .mdb
            {
                background-position: right -648px !important;
            }
             
            .RadFileExplorer td .csproj
            {
                background-position: right -711px !important;
            }
             
            .RadFileExplorer td .webinfo
            {
                background-position: right -744px !important;
            }
             
            .RadFileExplorer td .vbproj
            {
                background-position: right -775px !important;
            }
             
            .RadFileExplorer td .pdf
            {
                background-position: right -808px !important;
            }
             
            .RadFileExplorer td .bmp
            {
                background-position: right -840px !important;
            }
             
            .RadFileExplorer td .swf
            {
                background-position: right -872px !important;
            }
             
            .RadFileExplorer td .tif, .RadFileExplorer td .tiff
            {
                background-position: right -904px !important;
            }
             
            .RadFileExplorer td .mpg,
            .RadFileExplorer td .mpeg,
            .RadFileExplorer td .avi,
            .RadFileExplorer td .gp3,
            .RadFileExplorer td .mov,
            .RadFileExplorer td .mpeg4,
            .RadFileExplorer td .aif,
            .RadFileExplorer td .aiff,
            .RadFileExplorer td .rm,
            .RadFileExplorer td .wmv
            {
                background-position: right -936px !important;
            }
             
            .RadFileExplorer td .mp3,
            .RadFileExplorer td .mp4,
            .RadFileExplorer td .mid,
            .RadFileExplorer td .midi,
            .RadFileExplorer td .wav,
            .RadFileExplorer td .gp3,
            .RadFileExplorer td .gp4,
            .RadFileExplorer td .gp5,
            .RadFileExplorer td .wma,
            .RadFileExplorer td .ogg
            {
                background-position: right -1031px !important;
            }
             
            .RadFileExplorer td .fla, .RadFileExplorer td .flv
            {
                background-position: right -1063px !important;
            }
             
            .RadFileExplorer td .dll
            {
                background-position: right -1095px !important;
            }
             
            .RadFileExplorer td .xml
            {
                background-position: right -1127px !important;
            }
             
            .RadFileExplorer td .xslt
            {
                background-position: right -1159px !important;
            }
             
            .RadFileExplorer td .xsl
            {
                background-position: right -1191px !important;
            }
             
            .RadFileExplorer td .bac
            {
                background-position: right -681px;
            }

    Attached is feright.gif showing how FileExplorer will be rendered when the above CSS is applied.

    All the best,
    Bojo
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Back to Top