Saturday, March 24, 2012

TabContainer + ActiveTabChanged + __doPostBack Problem

I have a tabcontainer that i want to postback only when certain tabs are clicked (lets call them "postback tabs")

Here is the setup:

<ajax:UpdatePanel ID="upOuter" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<act:TabContainer ID="TabContainer1" runat="server" CssClass="MyTabStyle" ActiveTabIndex="0" OnClientActiveTabChanged="ActiveTabChanged">
....
....

<script language="javascript" type="text/javascript"
function ActiveTabChanged(sender, args) {
var ht = sender.get_activeTab().get_headerText();
if ((ht =="TabHeader1") || (ht =="TabHeader2") || (ht =="TabHeader3") ){
__doPostBack('<%= tabcontainer1.ClientID %>', sender.get_activeTab().get_headerText());
}
}
....
....

Server Side:

Protected Sub TabContainer1_ActiveTabChanged(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles TabContainer1.ActiveTabChanged

If TabContainer1.ActiveTab.HeaderText = "TabHeader1"Then
....
....
End If
If TabContainer1.ActiveTab.HeaderText = "TabHeader2"Then
....
....
End If
If TabContainer1.ActiveTab.HeaderText = "TabHeader1"Then
....
....
End If
End Sub

This actually works quite well except in the following case:

Step 1. I click on one of the postback tabs

Step 2. Click on a non-postback tab

Step 3. Click back on the tab from step 1.

When I do this, the client side script runs, but the postback never happens. If on step 2, i clicked on a postback tab, everything works fine. Or, if on step three I click on a different postback tab than in step 1, everything works fine.

Any ideas?

Figured out the problem. The postback IS happening, but the server-side activetabchanged event was not firing. The reason for this is that when I clicked on a non-postback tab, the server was not notified of the change in activetab. So, following the steps in the original post, when I click back on to the postback tab in step 3 (the same as the postback tab in step 1), the server thinks the active tab is still the same - since it was not notified of the change in step 2. Hence, ActiveTabChanged does not fire on the server-side.

No comments:

Post a Comment