Unable to resolve ASP.NET error when starting web app

Question

Here is my code:

<ajaxToolKit:TabPanel ID="mainTabMedicaidData" runat="server" HeaderText="Medicaid Data">
    <ContentTemplate>
       <ajaxToolKit:TabContainer ID="MedicaidDataSubTabContainer" runat="server">
           <ajaxToolKit:TabPanel ID="TabPanel1" runat="server" HeaderText="Search">
           <ContentTemplate>
               <asp:UpdatePanel ID="MedicaidDataPanel" runat="server" UpdateMode="Always">
           <ContentTemplate>
                <div class="formRow">  
                   <asp:Label runat="server" ID="uxMedicaidData_StudentNumberLabel" AssociatedControlID="uxMedicaidData_StudentNumber">
                        Student ID:
                   </asp:Label>
                   <asp:TextBox runat="server" ID="uxMedicaidData_StudentNumber" MaxLength="30" Width="80px"></asp:TextBox>
                   <asp:Label runat="server" ID="uxMedicaidData_SchoolYearLabel" AssociatedControlID="uxMedicaidData_SchoolYear">
                        School Year:
                   </asp:Label>
                   <asp:TextBox runat="server" ID="uxMedicaidData_SchoolYear" MaxLength="30" Width="50px"></asp:TextBox>
                   <asp:Label runat="server" ID="uxMedicaidData_CategoryLabel" AssociatedControlID="uxMedicaidData_ddCategory">
                        Category:
                   </asp:Label>
                   <asp:DropDownList ID="uxMedicaidData_ddCategory" runat="server"></asp:DropDownList>
                   <asp:Button runat="server" ID="MedicaidData_Search" Text="Search" width="100px" />
                </div>
            </ContentTemplate>
       </asp:UpdatePanel>

I know that the snippet does not have a closing tag for some of the tags at the beginning of the snippet. The reason I left them out is because there is a lot of code between them and their closing tags. Besides, from what I can tell my problem is with the with either 1 line or another in this code snippet. When I try to compile this to run the web app I get the following error:

TabContainer cannot have children of type 'System.Web.UI.WebControls.Button'.

The error highlights this line:

<ajaxToolKit:TabContainer ID="MedicaidDataSubTabContainer" runat="server">

But because the error states there can't be a button in the container I'm wondering if this line has something to do with it:

<asp:Button runat="server" ID="MedicaidData_Search" Text="Search" width="100px" />

I've looked at quite a few solutions online and they all say that the container needs runat="server" and an ID. As you can see both of these lines have those parts. Anyone have an idea of another solution I can try? Thanks in advance.

Answer 1

I think it's because you have content outside of a content template.

The outline should be

<ajaxToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0">

    <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="TabPanel1">
        <ContentTemplate>
            Content1
        </ContentTemplate>
    </ajaxToolkit:TabPanel>

    <ajaxToolkit:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2">
        <ContentTemplate>
            Content2
        </ContentTemplate>
    </ajaxToolkit:TabPanel>

</ajaxToolkit:TabContainer>