radTabStrip showing selected tab when on a child page

Posted by Community Admin on 05-Aug-2018 14:38

radTabStrip showing selected tab when on a child page

All Replies

Posted by Community Admin on 10-Jan-2013 00:00

Hello,
I am using the radTabStrip control with a sitefinity data sitemap to display tabs for second level navigation on my site.  (very similar to the method described here.  So lets say I have the tabs
Products  |  Services  |  Contact

I only want to display the pages at this level in the tabs. I am doing this by setting the MaxDataBindDepth="1" in the widget properties.  The problem is, when I'm on a child page of 'Contact' the contact no longer shows as 'selected'.  If I increase the MaxDataBindDepth I get the styling result I want, where the parent tab 'Contact' is selected but now I have the problem that it's creating and displaying a tab for the child page which I do not want.

My question is, is there an easy way with this control to only show one level, but still accurately display the parent tab as selected?

Thanks in advance for your help!
Matt

Posted by Community Admin on 15-Jan-2013 00:00

Hi Matt,

 Thanks for using Sitefinity.

I suppose that goes by what you define as easy.

Here's one way to go about it, though:

The idea is to grab the page title, find the parent page and its title, and then set the value to a hidden field. Using client side programming we can set the "selected" appearance to the appropriate parent page.

<asp:HiddenField ID="hidden" runat="server" />

and get the title / set it to the hidden field

protected void Page_Load(object sender, EventArgs e)
        
            var actualNode = SiteMapBase.GetActualCurrentNode();
            while (actualNode.ParentNode != null && actualNode.ParentNode.Title != "Pages")
            
                actualNode = actualNode.ParentNode as PageSiteNode;
  
            
                     hidden.Value = actualNode.Title;
        

Then you can get the matching element with something like this:

function TagMenu(targetClass, title)
    var elems = document.getElementsByClassName(targetClass);
    for (i in elems)
    
        if (elems[i].innerHTML == title)
        
            //Do styling on menu here.
        
    

.rmText is the default class assigned to the span that is wrapped in the link for the menu. 

I hope this helps!

Regards,
Patrick Dunn
the Telerik team
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

This thread is closed