Enable or Disable All Tabs Except the Selected Tab inside the Telerik RadTabStrip

We will explore the JavaScript code, by which we can easily Enable or Disable all the Tabs inside a Telerik RadTabStrip except the SelectedTab. In my previous Blog, we explored how to Enable or Disable all the Tabs. Now let’s see how we can just do this for all the Tabs except the current Tab.

How this is helpful?

This kind of requirement comes, when you have some business logic in a Tab (without saving the data), other Tabs can’t be accessible. Take one example, like, when you are registering something step by step. So, in first Tab, you will ask the User to enter some details and when he/she enters and hits register, you Enable all other Tabs, else just Disable.

How to?

If the Tab Text does not match with the SelectedTab‘s Text, then Disable it. Simple !!!

function DisableOtherTabs(){
    // Get the Tab Strip.
    var tabStrip = $find("<%= yourTabStripID.ClientID %>");

    // Get all the Tabs.
    var tabs = tabStrip.get_tabs();

    // Get Selected Tab.
    var selectedTab = tabStrip.get_selectedTab();

    // Now loop through all the Tabs and Disable one by one.
    for(var i = 0; i < tabStrip.get_allTabs().length; i++){
        // If the Tab Text does not match with the Selected Tab's Text, then Disable it. Simple !!!
        if(tabs.getTab(i).get_text().toUpperCase() != selectedTab.get_text().toUpperCase()){
            tabs.getTab(i).disable();
        }
    }
}

Thanks !!!

For taking time and reading the Blog. If you find it useful, then share within your circle, by pressing the Social Icons.
CodeProject

• ASP.NET
• JavaScript
• jQuery
• RadTabStrip
• Telerik