ajaxToolkit TabContainer question RSS

• • Reply
  yzidell

  Member

  26 Points

  634 Posts

  ajaxToolkit TabContainer question

  Oct 18, 2018 01:41 AM|yzidell|LINK

  i have an ajaxToolkit TabContainer - can i run some code when the user clicks on a tab?

  thx for ur help

• • Reply
  Fei Han - MS...

  All-Star

  40535 Points

  6233 Posts

  Microsoft

  Re: ajaxToolkit TabContainer question

  Oct 18, 2018 01:57 AM|Fei Han - MSFT|LINK

  Hi yzidell,

  yzidell

  have an ajaxToolkit TabContainer - can i run some code when the user clicks on a tab?

  You can achieve your requirement in ActiveTabChanged Event, you can refer to the following sample code.

  <ajaxToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" AutoPostBack="true" OnActiveTabChanged="TabContainer1_ActiveTabChanged">
      <ajaxToolkit:TabPanel runat="server" HeaderText="TabPanel1" ID="TabPanel1">
          <ContentTemplate>
              <h1>Tab1 content</h1>
          </ContentTemplate>
      </ajaxToolkit:TabPanel>
      <ajaxToolkit:TabPanel runat="server" HeaderText="TabPanel2" ID="TabPanel2">
              <ContentTemplate>
              <h1>Tab2 content</h1>
          </ContentTemplate>
      </ajaxToolkit:TabPanel>
      <ajaxToolkit:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3">
              <ContentTemplate>
              <h1>Tab3 content</h1>
          </ContentTemplate>
      </ajaxToolkit:TabPanel>
  </ajaxToolkit:TabContainer>
  <br />
  <asp:Label ID="Label1" runat="server" Text=""></asp:Label>

  protected void TabContainer1_ActiveTabChanged(object sender, EventArgs e)
  {
      //your code logic here
  
      Label1.Text = "Active Tab Index is " + TabContainer1.ActiveTabIndex;
  }

  Test Result:

  

  Note:

  The ajaxToolkit TabContainer control also provides some client side events, such as OnClientActiveTabChanged, OnClientClick (for TabPanel), you can get detailed information in it's documentation.

  With Regards,

  Fei Han

  .NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today.
• • Reply
  A2H

  All-Star

  50831 Points

  9895 Posts

  Re: ajaxToolkit TabContainer question

  Oct 18, 2018 02:02 AM|A2H|LINK

  TabPanel has a property called OnClientClick. You can use that to execute javascript code

    <script>
                  function tabclick() {
                      alert("Tab Clicked");
                  }
              </script>

    <ajaxToolkit:TabContainer ID="TabContainer1" runat="server">
                  <ajaxToolkit:TabPanel runat="server" ID="Panel2" HeaderText="Tab1" OnClientClick="tabclick">
                      <ContentTemplate>
                          <input id="Button1" type="button" value="button" />
                      </ContentTemplate>
                  </ajaxToolkit:TabPanel>
                  <ajaxToolkit:TabPanel runat="server" ID="TabPanel1" HeaderText="Tab2" OnClientClick="tabclick">
                       <ContentTemplate>
                          <input id="Button2" type="button" value="button" />
                      </ContentTemplate>
                  </ajaxToolkit:TabPanel>
              </ajaxToolkit:TabContainer>

  Thanks,
  Aje
  My Blog | Dotnet Funda