generate tabs dynamically using ajax

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • ravindarjobs
    New Member
    • May 2007
    • 86

    generate tabs dynamically using ajax

    Hi friends, i am using ajax in asp.net.

    i am using tab container, tab panel controls.

    i want to add tab panel control dynamically on button click.


    i form code is:


    Code:
    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
    
    <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
        Namespace="System.Web.UI" TagPrefix="asp" %>
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
    
    <!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>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            &nbsp;</div>
          <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <cc1:TabContainer ID="TabContainer1" runat="server" Width="600">
                <cc1:TabPanel ID="TabPanel1" runat="server" HeaderText="tab1">
                 <ContentTemplate>
                        <asp:Button ID="asd" runat="server" Width="30" />
                    </ContentTemplate>
                </cc1:TabPanel>
                <cc1:TabPanel ID="TabPanel2" runat="server" HeaderText="tab2">
                </cc1:TabPanel>
               
            </cc1:TabContainer>
            <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
            
        </form>
    </body>
    </html>

    my page code is:

    Code:
    public partial class _Default : System.Web.UI.Page 
    {
        int i = 0;
        AjaxControlToolkit.TabPanel tp;
        
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
        protected void Button1_Click(object sender, EventArgs e)
        {
            i = i + 1;
            tp = new AjaxControlToolkit.TabPanel();
            tp.ID = "tp" + i.ToString();
            Button b = new Button();
            b.ID = "b" + i.ToString();
            tp.Controls.Add(b);
            tp.HeaderText = "i am new" + i.ToString();
            TabContainer1.Controls.Add(tp);
        }
    }


    i am able to add one dynamic tab when i click the button first time. But when i click the button for the second time, i am getting error.

    "Specified argument was out of the range of valid values.
    Parameter name: index "


    any help?

    thank you.
    Last edited by acoder; Nov 28 '08, 11:24 AM. Reason: Added [code] tags
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    As a full member now, you should know that we expect your code to be posted in [CODE] tags (See How to Ask a Question).

    This makes it easier for our Experts to read and understand it. Failing to do so creates extra work for the moderators, thus wasting resources, otherwise available to answer the members' questions.

    You have been told nicely before, but the advice has fallen on deaf ears it seems. Regard this as a warning. Further violations may lead to a temporary an your account which I'm sure you'll want to avoid.

    Please use the tags in future.

    Moderator

    Comment

    • ravindarjobs
      New Member
      • May 2007
      • 86

      #3
      i do follow the rules from now.

      Indeed, yes i forgotten to add them.
      i wont repeat it again.

      Thank you

      Originally posted by acoder
      As a full member now, you should know that we expect your code to be posted in [CODE] tags (See How to Ask a Question).

      This makes it easier for our Experts to read and understand it. Failing to do so creates extra work for the moderators, thus wasting resources, otherwise available to answer the members' questions.

      You have been told nicely before, but the advice has fallen on deaf ears it seems. Regard this as a warning. Further violations may lead to a temporary an your account which I'm sure you'll want to avoid.

      Please use the tags in future.

      Moderator

      Comment

      • acoder
        Recognized Expert MVP
        • Nov 2006
        • 16032

        #4
        Originally posted by ravindarjobs
        "Specified argument was out of the range of valid values.
        Parameter name: index "
        That doesn't seem like a JavaScript error. It seems like a .NET one. Can you post the client-side version of your code.

        Comment

        • ravindarjobs
          New Member
          • May 2007
          • 86

          #5
          solved it

          yes it is .net using ajax.

          this link has helped me

          Siderite Zackwehdex's Blog: Fixing TabContainer to work with dynamic TabPanels

          Comment

          • acoder
            Recognized Expert MVP
            • Nov 2006
            • 16032

            #6
            Glad you got it working and thanks for posting the solution :)

            Comment

            Working...