Access master page tab

2 posts, 0 answers
  1. Naresh
    Naresh avatar
    3 posts
    Member since:
    May 2013

    Posted 10 Nov 2014 Link to this post

    I have radtabstrip created in master page.

    <div style="position:relative;left:10px; top:10px;z-index:10000">
          <telerik:RadTabStrip ID="RadTabStrip1" runat="server" OnClientTabSelected="OnClientTabSelected">
                    <telerik:RadTab ID="tab1" PageViewID="Page1"  runat="server" Text="Inbasket" NavigateUrl="NewInbasket.aspx">
                    <telerik:RadTab ID="tab2" PageViewID="Page2" runat="server" Text="Notification" NavigateUrl="Notification.aspx">
            </telerik:RadTabStrip > 

    On content page "NewInbasket.aspx" I am able to access "RadTabStrip1" 

    var radtabstrip = document.getElementById('<%= Page.Master.FindControl("RadTabStrip1").ClientID %>');  

    but not able to access RadTab "tab1" and "tab2" on content page "NewInbasket.aspx".

  2. Nencho
    Nencho avatar
    1777 posts

    Posted 12 Nov 2014 Link to this post

    Hello Suryakumar,

    First, I would like to suggest you to use the Client API, in order to get reference to the control (and the tabs) instead of the approach you attempt to use  - document.getElementById.
    In addition, the approach which I can suggest you to use in order to achive the desired functionality is as follows :
    1. Use the MasterPage and a custom function, in order to get a reference to the RadTabStrip and expose it through that function :
      function getTabStrip() {
                  var tabStrip = $find("<%= RadTabStrip1.ClientID %>");
                  return tabStrip;
    2. In any of the content pages, you can use window.parent.getTabStrip(),in order to get a reference to the RadTabStrip and then access the needed Tab :
      function OnClientClicked() {
                 var TabStrip = window.parent.getTabStrip();
                 var tab1 = TabStrip.findTabByText("Notification");

    In addition, in the attachment, you could find a simplified runnable project, demonstrating the behavior of the above suggested approach.


    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Back to Top