Hide Tab Clientside

[Steven]

I'm not getting an error and the alert shows the correct tab ID, any ideas why the tab is not hiding.

function HideHistoryTab(sender, e)
{
	var tabIndex = sender.get_activeTabIndex();
	if (tabIndex == 0 || tabIndex == 1)
	{
		var tabStrip = $find(_TabClientID);
		var tabs = tabStrip.get_tabs();
		//alert(tabs[3].get_id());
		tabs[3].set_visible(false);
	}
}

[Vessy]

Hi Steven,

The get_tabs() method of RadTabstrip returns a collection of tabs, but not an array and cannot be iterated by index in square brackets. You can iterate them them through the getTab(index) method.

            function HideHistoryTab(sender, e) {
                var tabIndex = sender.get_selectedIndex(); //sender.get_activeTabIndex();
                if (tabIndex == 0 || tabIndex == 1) {
                    var tabStrip = $find(_TabClientID);
                    var tabs = tabStrip.get_tabs();
                    tabs.getTab(3).set_visible(false);
                }
            }

Regards,
Vessy
Progress Telerik

[Steven]

Thank you for the reply Vessy.  I have an older version of Telerik (2017.3.913.45), two of the functions are not there.

sender.get_selectedIndex()

tabs.getTab(3)

I was not getting any errors with the code I posted, just not working.

[Vessy]

Thank you for the clarification, Steven.

I am attaching the HideHistoryTab function as a handler to a RadCombobox's OnclientSelectedIndexChanged event, thus it might be not available if you are handling different event. As the get_activeTabIndex() method is not available in RadTabStrip, can you share the event in which you are calling the HideHistoryTab function?

I tested the provided by you snippet with 2017.3.913.45 version of the controls but trying to get a tab by index again thrown a JavaScript error at my end.

Below you can see the whole setup I used for testing with 2017.3.913.45 version of the controls:

        <telerik:RadComboBox runat="server" ID="RadCombobox1" OnClientSelectedIndexChanged="HideHistoryTab">
            <Items>
                <telerik:RadComboBoxItem Text="Hide 1" />
                <telerik:RadComboBoxItem Text="Hide 2" />
                <telerik:RadComboBoxItem Text="Does not hide" Selected="true" />
            </Items>
        </telerik:RadComboBox>

        <telerik:RadTabStrip ID="RadTabStrip1" runat="server"
            OnClientLoad="onTabStripLoad">
            <Tabs>
                <telerik:RadTab Text="Tab 1"></telerik:RadTab>
                <telerik:RadTab Text="Tab 2"></telerik:RadTab>
                <telerik:RadTab Text="Tab 3" Selected="true"></telerik:RadTab>
                <telerik:RadTab Text="Tab 4"></telerik:RadTab>
                <telerik:RadTab Text="Tab 5"></telerik:RadTab>
                <telerik:RadTab Text="Tab 6"></telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
        <script>
            var _TabClientID;

            function onTabStripLoad(sender, args) {
                _TabClientID = "<%=RadTabStrip1.ClientID%>";
            }

            function HideHistoryTab(sender, e) {
                var tabIndex = sender.get_selectedIndex(); //sender.get_activeTabIndex();
                if (tabIndex == 0 || tabIndex == 1) {
                    var tabStrip = $find(_TabClientID);
                    var tabs = tabStrip.get_tabs();
                    //alert(tabs[3].get_id());
                    tabs.getTab(3).set_visible(false);
                }
            }
        </script>

 

[Steven]

Thank you very much Vessy, this works on my machine so I'll use it as a template for my tabs. Happy Holidays!

Steven

[Vessy]

You are welcome, Steven! Happy Holidays to you too! :))