AJAX tookkit Tab Control problem

Home ›

ASP.NET Forums » ASP.NET AJAX » ASP.NET AJAX Control Toolkit » AJAX tookkit Tab Control problem

Shortcuts

Previous Next

AJAX tookkit Tab Control problem

Last post 01-23-2009 1:58 AM by Zhi-Qiang Ni - MSFT. 1 replies.

Sort Posts:

AJAX tookkit Tab Control problem

01-19-2009, 4:25 PM

Contact

1,018 point Participant
KentZhou
Member since 05-03-2006, 3:48 PM
Posts 573

A Tab control with many tabs. each of then loaded dynamically from different user control.

One of then have a gridview. With this gridview, there is a ButtonField in the template.

Everytime, when clikced on this ButtonField button, its cause all other tab's content lost and become blank.

Then I want to trap the event for this ButtonField, I can't trap it. It looks like when click on this button, only cause post back at host aspx page, not even load the user control containing the gridview!

How to trap the event and find out the reason?

Re: AJAX tookkit Tab Control problem

01-23-2009, 1:58 AM

Contact

Answer

25,875 point All-Star
Zhi-Qiang Ni - MSFT
Member since 04-11-2008, 12:37 AM
Posts 2,322

Hi KentZhou,

Please refer to my sample code:

.aspx file

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="TestTabAddControl.aspx.vb"
    Inherits="SoluTest_TabControl.TestTabAddControl" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxControlToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            vertical-align: top;
            width: 201px;
            height: 41px;
        }
        .style2
        {
            vertical-align: top;
            height: 41px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <table style="border: medium double #000000; width: 64%; height: 274px;" cellpadding="0"
            cellspacing="0">
            <tr>
                <td class="style1" style="border-right-style: double;">
                    <AjaxControlToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="1"
                        Height="50px" Width="200px" AutoPostBack="true">
                        <AjaxControlToolkit:TabPanel runat="server" HeaderText="TabPanel1" ID="TabPanel1">
                            <ContentTemplate>
                                Get Control1</ContentTemplate>
                        </AjaxControlToolkit:TabPanel>
                        <AjaxControlToolkit:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2">
                            <HeaderTemplate>
                                TabPanel2
                            </HeaderTemplate>
                            <ContentTemplate>
                                Get Control2</ContentTemplate>
                        </AjaxControlToolkit:TabPanel>
                    </AjaxControlToolkit:TabContainer>
                </td>
                <td class="style2" style="border-left-style: double;">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

.aspx.vb file

Partial Public Class TestTabAddControl
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        addUserControl()
    End Sub

    Protected Sub TabContainer1_ActiveTabChanged(ByVal sender As Object, ByVal e As EventArgs) Handles TabContainer1.ActiveTabChanged
        addUserControl()
    End Sub

    Protected Sub addUserControl()
        PlaceHolder1.Controls.Clear()

        Select Case TabContainer1.ActiveTabIndex
            Case 0
                Dim control As New TestControl1
                control = LoadControl("TestControl1.ascx")
                PlaceHolder1.Controls.Add(control)
            Case 1
                Dim control As New TestControl2
                control = LoadControl("TestControl2.ascx")
                PlaceHolder1.Controls.Add(control)
        End Select
    End Sub
End Class

uc1.ascx file

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="TestControl1.ascx.vb" Inherits="SoluTest_TabControl.TestControl1" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="AjaxControlToolkit" %>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<AjaxControlToolkit:CalendarExtender ID="TextBox1_CalendarExtender" 
    runat="server" Enabled="True" TargetControlID="TextBox1">
</AjaxControlToolkit:CalendarExtender>

uc2.ascx file

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="TestControl2.ascx.vb"
    Inherits="SoluTest_TabControl.TestControl2" %>
<asp:Panel ID="Panel1" runat="server" BackColor="#99FF99" Height="60px" Width="160px">
    <asp:Label ID="Label1" runat="server" Text="Label">This is control2</asp:Label>
     <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ID"
        DataSourceID="SqlDataSource1">
        <Columns>
            <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" ReadOnly="True"
                SortExpression="ID" />
            <asp:TemplateField HeaderText="ButtonField" ShowHeader="False">
                <ItemTemplate>
                    <asp:Button ID="Button1" runat="server" Text='<%# Bind("Field1") %>' OnClick="Button1_Click" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:DatabaseConnectionString %>"
        ProviderName="<%$ ConnectionStrings:DatabaseConnectionString.ProviderName %>"
        SelectCommand="SELECT [ID], [Field1] FROM [AssName]"></asp:SqlDataSource>
</asp:Panel>

uc2.ascx.vb file

Public Partial Class TestControl2
    Inherits System.Web.UI.UserControl

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    End Sub

    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
        Label1.Text = "You have selected " + CType(sender, Button).Text
    End Sub
End Class

Have it helped?

Best regards,

Zhi-Qiang Ni

Microsoft Online Community Support

Please remember to click “Mark as Answer” on the post that helps you, and to click “Unmark as
Answer” if a marked post does not actually answer your question.

Page 1 of 1 (2 items)

RSS Available