Skip to main content
A newer version of this page is available. .
Tab

ASPxTabControlBase.ActiveTabChanged Event

Fires on the server side after the active tab has been changed within a tab control.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v20.2.dll

NuGet Package: DevExpress.Web

Declaration

public event TabControlEventHandler ActiveTabChanged

Event Data

The ActiveTabChanged event's data class is TabControlEventArgs. The following properties provide information specific to this event:

Property Description
Tab Gets a tab object related to the event.

Remarks

Write an ActiveTabChanged event handler to perform actions on the server side each time the selected tab is changed. You can use the event parameter’s Tab property to identify the new active tab.

When a user changes the active tab, a control (ASPxTabControl or ASPxPageControl) might raise the following events:

The following two properties control which events to generate:

Note

The processOnServer property’s default value is equal to a control’s AutoPostBack property setting.

The value of the AutoPostBack property affects the event generation logic as follows:

Example: Use AutoPostBack to Handle Events on the Server

This example enables the AutoPostBack property to make a control process ActiveTabChanging and ActiveTabChanged events on the server.

<dx:ASPxLabel ID="ActiveTabLabel" runat="server"/>
<dx:ASPxCheckBox ID="AllowTabChange" runat="server" Text="Allow Tab Change" Checked="True" CheckState="Checked"/>
<dx:ASPxTabControl ID="TabControl" runat="server" 
                   AutoPostBack="True"
                   OnActiveTabChanging="TabControl_ActiveTabChanging"
                   OnActiveTabChanged="TabControl_ActiveTabChanged">
  <Tabs>
    <dx:Tab Text="Tab1"/>
    <dx:Tab Text="Tab2"/>
    <dx:Tab Text="Tab3"/>
  </Tabs>
</dx:ASPxTabControl>
protected void TabControl_ActiveTabChanging(object source, DevExpress.Web.TabControlCancelEventArgs e){
    //Based on the checkbox state, specify whether to cancel the tab change.
    e.Cancel = !AllowTabChange.Checked;
}

protected void TabControl_ActiveTabChanged(object source, DevExpress.WebTabControlEventArgs e){
    //Display the name of the active tab.
    ActiveTabLabel.Text = $"Active Tab: {e.Tab.Text}";
}

Example: Use processOnServer to Pass Event Handling to the Server

This example shows how to make a control with the disabled AutoPostBack property generate the server-side ActiveTabChanging and ActiveTabChanged events. Enable the processOnServer property in a client-side ActiveTabChanging event handler to pass event processing to the server.

<dx:ASPxLabel ID="ActiveTabLabel" runat="server"/>
<dx:ASPxCheckBox ID="AllowTabChange" runat="server" Text="Allow Tab Change" Checked="True" CheckState="Checked"/>
<dx:ASPxTabControl ID="TabControl" runat="server"  
    OnActiveTabChanging="TabControl_ActiveTabChanging" 
    OnActiveTabChanged="TabControl_ActiveTabChanged"
    AutoPostBack="False">
    <Tabs>
        <dx:Tab Text="Tab 1"/>
        <dx:Tab Text="Tab 2"/>
        <dx:Tab Text="Tab 3"/>
    </Tabs>
    <ClientSideEvents ActiveTabChanging="function(s, e) {
        //Pass tab change processing to the server.
        e.processOnServer = true;
    }" />
</dx:ASPxTabControl>
protected void TabControl_ActiveTabChanging(object source, DevExpress.Web.TabControlCancelEventArgs e){
    //Based on the checkbox state, specify whether to cancel the tab change.
    e.Cancel = !AllowTabChange.Checked;
}

protected void TabControl_ActiveTabChanged(object source, DevExpress.Web.TabControlEventArgs e){
    //Display the name of the active tab.
    ActiveTabLabel.Text = $"Active Tab: {e.ActiveTab.Text}";
}
See Also