RadTabStrip for ASP.NET
Contents
Hierarchical tabstrip Send comments on this topic.
See Also
Feature overview > Hierarchical tabstrip

Glossary Item Box

You can create a hierarchical tabstrip in the following ways:

  • by defining the hierarchical structure inline;
  • programmatically, by using the server-side API;
  • by binding to a hierarchical data source control;
  • by binding to a non-hierarchical data source with a DataFieldID / DataFieldParentID relation.

Define the hierarchy inline

You do not need to set any property of the tabstrip to make it hierarchical. Simply arrange the tabs hierarchically when defining the tab through the ASPX.

A tabstrip control has a Tabs property that represents its tabs. You can add tab controls to this collection. You can also add tabs to the Tabs collection of any tab control. Thus, you can build the hierarchy of tab items rendered by a tab control.

Example

The example below illustrates a hierarchical tabstrip with up to three levels for some tabs. The picture shows all three levels. The active tabs in the picture are shown bold in the ASPX code.

A hierarchical tabstrip

ASPX Copy Code
<rad:RadTabStrip id="RadTabStrip1" runat="server" Skin="WinXP" SelectedIndex="0">
   <Tabs>
       <rad:Tab Text="Corporate" SelectedIndex="0">
           <Tabs>
               <rad:Tab Text="About us" SelectedIndex="0">
                   <Tabs>
                       <rad:Tab Text="News"></rad:Tab>
                       <rad:Tab Text="Team"></rad:Tab>
                   </Tabs>
               </rad:Tab>
               <rad:Tab Text="Careers"></rad:Tab>
           </Tabs>
       </rad:Tab>
       <rad:Tab Text="Services">
           <Tabs>
               <rad:Tab Text="Products"></rad:Tab>
               <rad:Tab Text="Solutions"></rad:Tab>
               <rad:Tab Text="Certifications"></rad:Tab>
           </Tabs>
       </rad:Tab>
       <rad:Tab Text="Work">
           <Tabs>
               <rad:Tab Text="Clients"></rad:Tab>
               <rad:Tab Text="Testimonials"></rad:Tab>
               <rad:Tab Text="FAQ"></rad:Tab>
           </Tabs>
       </rad:Tab>
   </Tabs>
</rad:RadTabStrip>
See a live example of this functionality at www.telerik.com.

Bind to a hierarchical data source

If bound to a hierarchical data source, the tabstrip will appear multi-level. You do not need to set any additional properties.

To learn more, see SiteMapDataSource control.

Bind to a non-hierarchical data source with the DataFieldID/DataFieldParentID

See  Hierarchical data binding.

See Also