More in this section

Forums / Developing with Sitefinity / Treeview selected item bug?

Treeview selected item bug?

5 posts, 1 answered
  1. Ivan
    Ivan avatar
    51 posts
    Registered:
    22 Aug 2007
    02 Dec 2009
    Link to this post
    Hi,

    I am using a treeview for site navigation.  I am experiencing a problem where I have a third level content item that shows the proper selected state but when I choose one of it's children (fourth level) it initially appears selected properly but when the request is completed it shows the third level again.  It seems like the <span> tag that indicates the highlighted item might be set incorrectly.

    I am also using a custom skin but I don't think that would be causing the issue.

    I have attached screenshots.

    Thanks in advance.
    -Ivan
  2. Georgi
    Georgi avatar
    3583 posts
    Registered:
    28 Oct 2016
    08 Dec 2009
    Link to this post
    Hello Ivan,

    Can you please send us the control as well as the skin you are using? We will recreate the issue with your control, which allow us to provide you with an accurate solution.

    Thank you in advance. 

    Kind regards,
    Georgi
    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.
  3. Ivan
    Ivan avatar
    51 posts
    Registered:
    22 Aug 2007
    08 Dec 2009
    Link to this post
    Hi Georgi,

    I added a CustomSkins folder to my project and added the Treeview folder with images and a customized css file Treeview.MySkin.css.  In my master page I add a reference to this custom file.  I used the standard Sitemap Treeview control provided in 3.7 and I set the skin attribute to MySkin and set the EnableEmbeddedBaseStylesheet attribute to false.  Since I couldn't attach the css file directly, I inserted the code below.  If you need the full code can you let me know how I can send you an email directly?  My client holds the actual licensed version so I am unable to submit a support ticket on their behalf.

    Thanks.
    -Ivan

    /*
    RadTreeView MySkin skin
    * For notes on the CSS class names, please check RadTreeView common skin file *
    */ 
     
    /* general styles */ 
     
    .RadTreeView_MySkin, 
    .RadTreeView_MySkin a.rtIn, 
    .RadTreeView_MySkin .rtEdit .rtIn input 
        font:11px Arial,sans-serif
        color:#000
        line-height:1.273em; 
     
    .RadTreeView_MySkin .rtTop,  
    .RadTreeView_MySkin .rtMid,  
    .RadTreeView_MySkin .rtBot 
        padding: 0 0 0 20px
     
    .RadTreeView_MySkin .rtPlus,  
    .RadTreeView_MySkin .rtMinus 
        margin:4px 6px 0 -18px
        width:11px
        height:11px
     
    .RadTreeView_MySkin .rtPlus 
        backgroundtransparent url(TreeView/PlusMinus.gif) no-repeat 0 0; 
     
    .RadTreeView_MySkin .rtMinus 
        backgroundtransparent url(TreeView/PlusMinus.gif) no-repeat 0 -11px
     
    .RadTreeView_MySkin .rtSp 
        height:20px
     
    .RadTreeView_MySkin .rtChk 
        margin: 0 2px
        padding:0; 
        width:13px
        height:13px
     
    .RadTreeView_MySkin .rtIn 
        margin1px 0; 
        padding2px 3px 3px
     
    /* endof general styles */ 
     
    /*Three state checkboxes*/ 
     
    .RadTreeView_MySkin .rtIndeterminate 
        backgroundtransparent url(TreeView/TriState.gif) no-repeat 0 -26px
     
    .RadTreeView_MySkin .rtChecked 
        backgroundtransparent url(TreeView/TriState.gif) no-repeat 0 0; 
     
    .RadTreeView_MySkin .rtUnchecked 
        backgroundtransparent url(TreeView/TriState.gif) no-repeat 0 -13px ; 
             
    /* node states */ 
     
    .RadTreeView_MySkin .rtHover .rtIn 
        color#363636
        background#e2e2e2
        border1px solid #e2e2e2
        padding1px 2px 2px
     
    .RadTreeView_MySkin .rtSelected .rtIn 
        color:#fff
        background:#454545 url(TreeView/ItemSelectedBg.gif) repeat-x 0 0; 
        border1px solid #040404
        padding1px 2px 2px
     
    .RadTreeView_MySkin_disabled .rtIn, 
    .RadTreeView_MySkin .rtDisabled .rtIn 
        color:#ccc
     
    .RadTreeView_MySkin .rtSelected .rtLoadingBelow 
        color#000
     
    /* endof node states */ 
     
     
    /* in-line editing */ 
     
    .RadTreeView_MySkin .rtLI .rtEdit .rtIn 
        border:1px solid black
        padding2px 1px 3px
        height:1.2em; 
        background#fff
     
    .RadTreeView_MySkin .rtEdit .rtIn input 
        height:1.4em; 
        line-height:1em; 
        border:0; 
        margin:0; 
        padding:0; 
        background:transparent
     
    * html div.RadTreeView_MySkin .rtLI .rtEdit .rtIn { padding-bottom1px;  } 
    * html div.RadTreeView_MySkin .rtLI .rtEdit .rtIn input { line-height: 1.3em;} 
    *+html div.RadTreeView_MySkin .rtLI .rtEdit .rtIn { padding-bottom1px;  } 
    *+html div.RadTreeView_MySkin .rtLI .rtEdit .rtIn input { line-height: 1.3em;} 
     
    /* endof in-line editing */ 
     
     
    /* drop targets */ 
     
    .rtDropAbove_MySkin, 
    .rtDropBelow_MySkin 
        border1px dotted black
        font-size3px
        line-height3px
        height3px
     
    .rtDropAbove_MySkin 
        border-bottom: 0; 
     
    .rtDropBelow_MySkin 
        border-top: 0; 
     
    /* endof drop targets */ 
     
     
    /* node lines */ 
     
    .RadTreeView_MySkin .rtLines .rtLI, 
    .RadTreeView_MySkin .rtLines .rtFirst .rtUL 
        background:url(TreeView/NodeSpan.gif) repeat-y 0 0; 
    .RadTreeView_MySkin_rtl .rtLines .rtLI, 
    .RadTreeView_MySkin_rtl .rtLines .rtFirst .rtUL 
        background:url(TreeView/NodeSpan_rtl.gif) repeat-y 100% 0; 
     
    .RadTreeView_MySkin .rtLines .rtFirst 
        background:url(TreeView/FirstNodeSpan.gif) no-repeat 0 1.273em; 
     
    .RadTreeView_MySkin_rtl .rtLines .rtFirst 
        background:url(TreeView/FirstNodeSpan_rtl.gif) no-repeat 100% 1.273em; 
     
    .RadTreeView_MySkin .rtLines .rtFirst .rtUL 
        background:url(TreeView/FirstNodeSpan.gif) repeat-y 0 1.273em; 
     
    .RadTreeView_MySkin_rtl .rtLines .rtFirst .rtUL 
        background:url(TreeView/FirstNodeSpan_rtl.gif) repeat-y 100% 1.273em; 
     
    .RadTreeView_MySkin .rtLines .rtLast, 
    .RadTreeView_MySkin .rtLines .rtLast .rtUL 
        background:none
     
    .RadTreeView_MySkin .rtLines .rtTop 
        background:url(TreeView/TopLine.gif) 0 0 no-repeat
    .RadTreeView_MySkin_rtl .rtLines .rtTop 
        background:url(TreeView/TopLine_rtl.gif) 100% 0 no-repeat
     
    .RadTreeView_MySkin .rtLines .rtLast .rtTop 
        background:url(TreeView/SingleLine.gif) 0 0 no-repeat
     
    .RadTreeView_MySkin_rtl .rtLines .rtLast .rtTop 
        background:url(TreeView/SingleLine_rtl.gif) 100% 0 no-repeat
     
    .RadTreeView_MySkin .rtLines .rtMid 
        background:url(TreeView/MiddleLine.gif) 0 0 no-repeat
    .RadTreeView_MySkin_rtl .rtLines .rtMid 
        background:url(TreeView/MiddleLine_rtl.gif) 100% 0 no-repeat
     
    .RadTreeView_MySkin .rtLines .rtBot 
        background:url(TreeView/BottomLine.gif) 0 0 no-repeat
    .RadTreeView_MySkin_rtl .rtLines .rtBot 
        background:url(TreeView/BottomLine_rtl.gif) 100% 0 no-repeat
     
    /* endof node lines */ 
     
     
    /* rtl-specific styles */ 
     
    /* firefox */ 
    .RadTreeView_MySkin_rtl .rtPlus, 
    .RadTreeView_MySkin_rtl .rtMinus 
        margin-right:-11px
        rightright:-13px
     
    * html .RadTreeView_MySkin_rtl .rtPlus, 
    * html .RadTreeView_MySkin_rtl .rtMinus 
        margin-right:-18px
        rightright:0; 
     
    *+html .RadTreeView_MySkin_rtl .rtPlus, 
    *+html .RadTreeView_MySkin_rtl .rtMinus 
        margin-right:-18px
        rightright:0; 
     
    .RadTreeView_MySkin_rtl .rtTop, 
    .RadTreeView_MySkin_rtl .rtMid,  
    .RadTreeView_MySkin_rtl .rtBot 
        padding: 0 20px 2px 0; 
        margin:0; 
     
    /* endof rtl-specific styles */ 
     
    /* hacks for Opera & Safari */ 
     
    @media all and (-webkit-min-device-pixel-ratio:10000), 
          not all and (-webkit-min-device-pixel-ratio:0) 
        /* fixes for opera (changes the paddings/margins automatically in rtl mode) */ 
         
        :root div.RadTreeView_MySkin_rtl .rtLI .rtPlus, 
        :root div.RadTreeView_MySkin_rtl .rtLI .rtMinus, 
        :root div.RadTreeView_MySkin_rtl .rtFirst .rtLI .rtPlus, 
        :root div.RadTreeView_MySkin_rtl .rtFirst .rtLI .rtMinus 
        { 
            margin:4px 6px 0 -18px
            rightright:0; 
        } 
         
    @media screen and (min-width:50px
        /* fix for safari bug (inline-block positioned elements in rtl mode get no width) */ 
        :root div.RadTreeView_MySkin_rtl .rtLI .rtPlus, 
        :root div.RadTreeView_MySkin_rtl .rtLI .rtMinus 
        { 
            rightright: 0; 
            margin-right: -18px
            margin-left7px
        } 
     
    /* endof hacks */ 

  4. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    09 Dec 2009
    Link to this post
    Hello Ivan,

    Thank you for getting back to us.

    Can you please open the ~/Sitefinity/UserControls/Navigation35/SiteTreeview.ascx.cs file and modify the RadTreeview1_NodeBound event handler like this:

    public void RadTreeview1_NodeBound(object o, RadTreeNodeEventArgs e)
    {
        if (this.RadTreeview1.MultipleSelect)
        {
            CmsSiteMapNode currentNode = SiteMap.CurrentNode as CmsSiteMapNode;
            if (currentNode != null && currentNode.ParentNode != null)
            {
                while (currentNode != null && currentNode.ParentNode != SiteMap.RootNode)
                {
                    RadTreeNode item2 = this.RadTreeview1.FindNodeByUrl(this.ResolveUrl(currentNode.Url));
                    if (item2 != null)
                        item2.Selected = true;
                     
                    currentNode = currentNode.ParentNode as CmsSiteMapNode;
                }
            }
        }
    }

    This should do the trick.


    Regards,
    Radoslav Georgiev
    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.
    Answered
  5. Ivan
    Ivan avatar
    51 posts
    Registered:
    22 Aug 2007
    09 Dec 2009
    Link to this post
    Thanks Georgi, that did the trick!
Register for webinar
5 posts, 1 answered