Click on child tab and load its ContentUrl using JavaScript | RadTabStrip for ASP.NET AJAX Documentation
Edit this page

Click on child tab and load its ContentUrl using JavaScript

The below implementation demonstrates how to select child tab when a parent tab has been clicked and simultaneously load the content of the child corresponding page when using NavigateUrl property:

<script type="text/javascript">
    function ClientTabSelectedHandler(sender, eventArgs) {
      var tabStrip = sender;
      var tab = eventArgs.get_tab();
      if (tab.get_tabs().get_count() > 0) {
          var url = tab.get_tabs().getTab(0).get_navigateUrl();
          document.location.href = url;
<telerik:RadTabStrip RenderMode="Lightweight" id="RadTabStrip" runat="server" Skin="Outlook" EnableViewState="False" OnClientTabSelected="ClientTabSelectedHandler">
    <telerik:RadTab runat="server" Text="RootTabLevel0Tab0" NavigateUrl="~/Tabs/Home.aspx"></ telerik:RadTab>
    <telerik:RadTab runat="server" Text="RootTabLevel0Tab1">
        <telerik:RadTab runat="server" Text="ChildTabLevel1Tab0" NavigateUrl="~/Tabs/ChildTabContent0.aspx"></telerik:RadTab>
        <telerik:RadTab runat="server" Text="ChildTabLevel1Tab1" NavigateUrl="~/Tabs/ChildTabContent1.aspx"></telerik:RadTab>
        <telerik:RadTab runat="server" Text="ChildTabLevel1Tab2" NavigateUrl="~/ Tabs/ChildTabContent2.aspx"></telerik:RadTab>
    </ telerik:RadTab>
</ telerik:RadTabStrip> 
Is this article helpful? No Yes
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article