Get ActiveTabIndex from Ajax TabContainer using Javascript

11,776

ASPX:

<ajaxToolkit:TabContainer ID="TabContainer1" runat="server" OnClientActiveTabChanged="clientActiveTabChanged">
<ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="Test1">
    <ContentTemplate>Test1</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="TabPanel2" runat="server" HeaderText="Test2">
    <ContentTemplate>Test2</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="TabPanel3" runat="server" HeaderText="Test3">
    <ContentTemplate>Test3</ContentTemplate>
</ajaxToolkit:TabPanel>


JS:

<script type="text/javascript">

function clientActiveTabChanged(sender, args) {

    alert(sender.get_activeTabIndex());
}

Share:
11,776
Troy Mitchel
Author by

Troy Mitchel

Updated on November 23, 2022

Comments

  • Troy Mitchel
    Troy Mitchel over 1 year

    How would I get the ActiveTabIndex from TabContainer when the user selects a tab? I've tried the following but does not work.

    <script type="text/javascript">
        function TabChange() {
            var tc = document.getElementById("TabContainer1")
            alert(tc.ActiveTabIndex);
        }
    </script>
    
     <asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" Height="300px"
            Width="300px" CssClass="MyTabStyle" OnClientActiveTabChanged="TabChange">
            <asp:TabPanel runat="server" HeaderText="First" ID="TabPanel1">
                <ContentTemplate>
                    <h1>
                        Tab 1
                    </h1>
                </ContentTemplate>
            </asp:TabPanel>
            <asp:TabPanel ID="TabPanel2" runat="server" HeaderText="Second">
                <ContentTemplate>
                    <h1>
                        Tab 2
                    </h1>
                </ContentTemplate>
            </asp:TabPanel>
     </asp:TabContainer>
    
    • ahaliav fox
      ahaliav fox over 11 years
    • Troy Mitchel
      Troy Mitchel over 11 years
      @ahaliav yes that works to my expectations. thanks. if you put in answer then i can mark as answered.