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

Main + Side menus with TabStrip and Menu controls?

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

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>
        <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>
        <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>
        <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" />
            </siteMapNode>
        </siteMapNode>
    </siteMapNode>
</siteMap>

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">
</telerik:RadTabStrip>


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" >
</telerik:RadMenu>


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
0
Peter
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,
Peter
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
Tags
TabStrip
Asked by
Ian
Top achievements
Rank 1
Answers by
Peter
Telerik team
Share this question
or