RadTabStrip for ASP.NET AJAX

RadControls for ASP.NET AJAX

RadTabStrip provides a client-side API for adding, deleting and disabling tabs. By using the trackChanges and commitChanges methods of the client-side RadTabStrip object, these changes can persist after a postback.

Adding tabs

To add a tab, use the add or insert method of the tabs collection:

CopyJavaScript
     

        function AddNewTabs()
        { 
          var tabstrip = $find("<%= RadTabStrip1.ClientID %>");
          var roottab = new Telerik.Web.UI.RadTab();
          roottab.set_text("New Root Tab");
          var childTab = new Telerik.Web.UI.RadTab();
          childTab.set_text("New Child Tab");
          var firstChild = new Telerik.Web.UI.RadTab();
          firstChild.set_text("New First Child");

          tabstrip.trackChanges();
          tabstrip.get_tabs().add(roottab);
          roottab.get_tabs().add(childTab);
          roottab.get_tabs().insert(0, firstChild);
          tabstrip.commitChanges();
        }


Removing tabs

Use the remove or removeAt method of the tabs collection to remove tabs:

CopyJavaScript
     

        function RemoveTab()
        {
          var tabStrip = $find("<%= RadTabStrip1.ClientID %>");
          var tab = tabStrip.findTabByText("delete me");
          if (tab)
          {
            var parentTab = tab.get_parent();
            tabStrip.trackChanges();
            parentTab.get_tabs().remove(tab);
            // or
        parentTab.get_tabs().removeAt(tab.get_index());
            tabStrip.commitChanges();
          }
        }


Enabling and Disabling items

Use the disable and enable methods of the tabs collection to disable or enable items:

CopyJavaScript
     

        function DisableItem()
        {     
           var tabStrip = $find("<%= RadTabStrip1.ClientID
        %>");
           var tab = tabStrip.findTabByText("disable me");
           if(tab)
           {
             tabStrip.trackChanges();

        tab.disable();         
             tabStrip.commitChanges();
           }
        }

        function EnableItem()
        {
           var tabStrip = $find("<%= RadTabStrip1.ClientID
        %>");
           var tab = tabStrip.findTabByText("enable me");
           if(tab && !tab.get_isEnabled())
           {
             tabStrip.trackChanges();

        tab.enable();         
             tabStrip.commitChanges();
           }
        }


See Also