asked on

First TabPanel always displayed when navigating back to a page using ASP.NET 3.5 SP1 AJAX History feature

Hi, I have an ASP.NET v3.5 SP1 page that contains a TabContainer from the AJAX Control Toolkit. I have the ScriptManager's EnableHistory attribute set to True. In my codebehind, I handle the ActiveTabChanged event and call ScriptManager.AddHistoryPoint passing the index of the current tab. My browser history correctly records the tabs that I visit, however there is a round-trip to the server each time I change the active tab. One of my tabs contains an updatepanel. If I set a trigger for this updatepanel (<asp:AsyncPostBackTrigger ControlID="SearchTabs" EventName="ActiveTabChanged" />) then the round-trip no longer occurs but this then stops the activetab from correctly changing when the ScriptManager_Navigate procedure runs.

The attached code sample demonstrates the problem.

Can anyone identify why the AsyncPostBackTrigger prevents the tab being changed?

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="Search_Default"
    EnableEventValidation="false" EnableViewState="true" Title="AJAX control toolkit test" %>
 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<html>
<head runat="server">
    <title>test</title>
</head>
<body>
    <form runat="server">
    <asp:ScriptManager ID="ScriptManager" runat="server" EnableHistory="true" EnableSecureHistoryState="false"
        OnNavigate="ScriptManager_Navigate">
    </asp:ScriptManager>
    <cc1:TabContainer ID="SearchTabs" runat="server" Width="100%" AutoPostBack="true"
        OnActiveTabChanged="SearchTabs_ActiveTabChanged">
        <cc1:TabPanel ID="Tab1" runat="server" HeaderText="FreeText">
            <HeaderTemplate>
                Tab 1
            </HeaderTemplate>
            <ContentTemplate>
            </ContentTemplate>
        </cc1:TabPanel>
        <cc1:TabPanel ID="Tab2" runat="server" HeaderText="Database">
            <HeaderTemplate>
                Tab 2
            </HeaderTemplate>
            <ContentTemplate>
                <asp:UpdatePanel ID="JudgmentsPanel" runat="server">
                    <ContentTemplate>
                        this is some content - in reality I have some user controls here
                    </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="SearchTabs" EventName="ActiveTabChanged" />
                    </Triggers>
                </asp:UpdatePanel>
            </ContentTemplate>
        </cc1:TabPanel>
        <cc1:TabPanel ID="Tab3" runat="server" HeaderText="FreeText">
            <HeaderTemplate>
                Tab 3
            </HeaderTemplate>
            <ContentTemplate>
            </ContentTemplate>
        </cc1:TabPanel>
    </cc1:TabContainer>
    </form>
</body>
</html>
 
 
 
 
 
 
Imports System.Diagnostics
Imports AjaxControlToolkit
 
Partial Class Search_Default
    Inherits System.Web.UI.Page
 
    Dim PageState As New NameValueCollection
 
    Protected Property ActiveTabIndex() As Integer
        Get
            If Not ViewState("ActiveTabIndex") Is Nothing Then
                Return Convert.ToInt32(ViewState("ActiveTabIndex"))
            Else
                Return 0
            End If
        End Get
        Set(ByVal value As Integer)
            ViewState("ActiveTabIndex") = value
        End Set
    End Property
 
    Protected Sub SearchTabs_ActiveTabChanged(ByVal sender As Object, ByVal e As System.EventArgs)
 
        '    ScriptManager.AddHistoryPoint(PageState, ActiveTabIndex.ToString())
 
        ActiveTabIndex = SearchTabs.ActiveTabIndex ' Update the ActiveTabIndex property
        If ScriptManager.IsInAsyncPostBack And Not ScriptManager.IsNavigating Then
            ScriptManager.AddHistoryPoint("Tab", ActiveTabIndex.ToString(), "Test tab " & ActiveTabIndex.ToString)
        End If
 
    End Sub
 
    'Private Sub SetupJavascript()
    '    Dim sb As StringBuilder = New StringBuilder()
    '    sb.Append("function activeTabChanged(sender, e) {")
    '    sb.Append("__doPostBack('" + SearchTabs.UniqueID + "', sender.get_activeTabIndex()); ")
    '    sb.Append("}")
 
    '    Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "TabChanged", sb.ToString(), True)
 
    'End Sub
 
 
#Region "Handle use of back button"
 
    Protected Sub ScriptManager_Navigate(ByVal sender As Object, ByVal e As System.Web.UI.HistoryEventArgs)
 
        'This runs when the user clicks the browser's back button or forward button, or when clicking on a link (for example in their favorites) 
        'which has some page state parameters that we can use to restore a previous search that they did
 
        Trace.Write("User pressed browser's back or forward button")
 
        If e.State.HasKeys Then
            If e.State.Item("Tab") IsNot Nothing Then
 
                If IsNumeric(e.State.Item("Tab")) Then
                    Dim TabIndex As Integer = e.State.Item("Tab")
                    If TabIndex >= 0 AndAlso TabIndex <= SearchTabs.Tabs.Count + 1 Then
 
                        SearchTabs.ActiveTabIndex = Convert.ToInt32(e.State("Tab"))
 
                    Else
                        Throw New ApplicationException("Unexpected value for Tab parameter.")
                    End If
                Else
                    Throw New ApplicationException("Tab parameter must be numeric.")
                End If
            Else
                'Tab was not a parameter
            End If
 
        End If
 
    End Sub
 
#End Region
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
        If (Not Page.IsPostBack) Then
            ActiveTabIndex = 0
        End If
    End Sub
 
End Class

Open in new window

ASKER CERTIFIED SOLUTION

Nasir Razzaq

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Hairbrush

ASKER

Brilliant! You are my hero - many thanks, that works!