This is a migrated thread and some comments may be shown as answers.

Main + Side menus with TabStrip and Menu controls?

1 Answer 264 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Ian asked on 06 Aug 2010, 02:38 PM

I have my site layout in a web.sitemap file as I want a common place to store my site layout that can then be used in a number of controls throughout my application. I want to create a site navigation system that has a tabbed main menu (horizontal - 1 level deep) in my top navigation banner and a sub-menu (all sub levels for selected item in main menu, either in an expanded treeview or multilevel bulleted list) in a sidebar.

I made a start on trying to do this but got messed up quite quickly. I bound a the sitemap file to a RadSiteMapDataSource and used this to bind to a RadTabStrip, but I wasn't able to restrict the tab navigation to the top level nodes only - I got a set of nested tabs (see attached image).

Sitemap code:
<?xml version="1.0" encoding="utf-8" ?>
        <siteMapNode url="" title="Menu 1"  description="Menu 1">
            <siteMapNode url="" title="Sub Menu A"  description="Sub Menu A" />
            <siteMapNode url="" title="Sub Menu B"  description="Sub Menu B" />
            <siteMapNode url="" title="Sub Menu C"  description="Sub Menu C" />
        <siteMapNode url="" title="Menu 2"  description="Menu 2">
            <siteMapNode url="" title="Sub Menu D"  description="Sub Menu D" />
            <siteMapNode url="" title="Sub Menu E"  description="Sub Menu E" />
            <siteMapNode url="" title="Sub Menu F"  description="Sub Menu F" />
        <siteMapNode url="" title="Menu 3"  description="Menu 3">
            <siteMapNode url="" title="Sub Menu G"  description="Sub Menu G" />
            <siteMapNode url="" title="Nested Menu 1"  description="Nested Menu 1">
                <siteMapNode url="" title="Sub Menu H"  description="Sub Menu H" />
                <siteMapNode url="" title="Sub Menu I"  description="Sub Menu I" />

Main Tab Menu code:
<telerik:RadSiteMapDataSource ID="TabMenuDataSource" runat="server" ShowStartingNode="False" SiteMapFile="Web.sitemap" />
<telerik:RadTabStrip ID="RadTabStrip1" runat="server" DataSourceID="TabMenuDataSource" ShowBaseLine="True" Orientation="HorizontalTop">

Can anyone tell me how I can achieve the effect I want? Am I doing this the right way? Is it possible to limit the tabs to the first level of nodes in the sitemap (e.g. Menu 1-3)? How do I have a sidebar menu that displays the sub-menu items for the selected node in the main menu? I tried creating the Side Menu using the code below but it didn't display anything at all:

Side Menu code (doesn't render anything):
<telerik:RadSiteMapDataSource ID="SidebarDataSource" runat="server" ShowStartingNode="false" SiteMapFile="Web.sitemap" StartFromCurrentNode="true"  />
<telerik:RadMenu ID="RadMenu1" runat="server" DataSourceID="SidebarDataSource" >

I'm sure I've seen this (or something similar) done on a Sitefinity showcase but just can't see how to do it now. Can anyone help?

Thanks, Ian


1 Answer, 1 is accepted

Sort by
Telerik team
answered on 11 Aug 2010, 01:34 PM
Hi Ian,

You can use approach similar to the Related Menus demo. Attached is a sample with RadTabStrip and RadMenu.

All the best,
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
Asked by
Top achievements
Rank 1
Answers by
Telerik team
Share this question