Monday, March 26, 2012

tab control problem

I have a default page that takes it from master page, I have put update panel and model pop up inside the my default page. Now I want to use Tab control for my default page. Three tabs, and when they click first one my panel1 will display, second tab clicked panel2 third panel3 will display. I have my pop up on panel 2.

I have created everything by watching video from example, but I cannot see my panel 2 and 3, only can see panel1. What I need to add. Maybe javascript?

Hi,

Here is a sample page made according to your description, please try it. In masterPage, there is nothing more than a ScriptManager.

<%@. Page Language="C#" MasterPageFile="~/MasterPage.master" Title="Untitled Page" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <ajaxToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="1"> <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="TabPanel1"> <ContentTemplate> <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px"> Panel 1</asp:Panel> </ContentTemplate> </ajaxToolkit:TabPanel> <ajaxToolkit:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2"> <ContentTemplate> <asp:Panel ID="Panel2" runat="server" Height="50px" Width="125px"> Panel 2</br> <asp:Panel ID="Panel4" runat="server" Height="50px" Width="125px"> Popup<br /> <asp:Button ID="btnOK" runat="server" Text="OK" /></asp:Panel> <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupControlID="Panel4" OkControlID="btnOK" TargetControlID="Button1"> </ajaxToolkit:ModalPopupExtender> <asp:Button ID="Button1" runat="server" Text="Pop" /> </asp:Panel> </ContentTemplate> </ajaxToolkit:TabPanel> <ajaxToolkit:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3"> <ContentTemplate> <asp:Panel ID="Panel3" runat="server" Height="50px" Width="125px"> Panel 3</asp:Panel> </ContentTemplate> </ajaxToolkit:TabPanel> </ajaxToolkit:TabContainer> </ContentTemplate> </asp:UpdatePanel>  </asp:Content>

No comments:

Post a Comment