Hide Tab Clientside

1 Answer 23 Views
TabStrip
Steven
Top achievements
Rank 1
Steven asked on 17 Dec 2021, 07:26 PM

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);
	}
}

1 Answer, 1 is accepted

Sort by
0
Accepted
Vessy
Telerik team
answered on 20 Dec 2021, 03:43 PM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Steven
Top achievements
Rank 1
commented on 20 Dec 2021, 04:14 PM

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
Telerik team
commented on 23 Dec 2021, 10:48 AM

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
Top achievements
Rank 1
commented on 24 Dec 2021, 04:35 PM

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
Telerik team
commented on 27 Dec 2021, 12:59 PM

You are welcome, Steven! Happy Holidays to you too! :))
Tags
TabStrip
Asked by
Steven
Top achievements
Rank 1
Answers by
Vessy
Telerik team
Share this question
or