Search code examples
c#asp.netaccordionrepeaterajaxcontroltoolkit

Placing a repeater inside an AjaxToolKit Accordion


I am trying to use a repeater inside an AjaxToolKit Accordion. This is necessary because I need pagination within my DataList using a SQL stored procedure. It works fine if I place the repeater outside of the AjaxToolKit Accordion, but I need to place the repeater inside the accordion. I am accessing the inner repeater (from code-behind) by placing an outer repeater outside of my Ajax Accordion. However, I'm still getting an error:

Type 'System.Web.UI.WebControls.Repeater' does not have a public property named 'Accordion'.

Here is my asp.net webform:

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:Repeater ID="RepeaterOutside" runat="server">
<ajaxToolkit:Accordion ID="Accordion1" runat="server" HeaderCssClass="accordion" ContentCssClass="accordion" HeaderSelectedCssClass="accordion" FadeTransitions="true" TransitionDuration="500" AutoSize="None" SelectedIndex="-1" RequireOpenedPane="false">
    <Panes>
        <ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server">
            <Header>
                <p>Click selection for details.</p>
                <div class="panel panel-default">
                    <div class="alertHeading" style="color: red; background-color: lightgray; font-weight: 700; padding: 1em; border-radius: 5px; border: dashed 1px; border-color: black;">ACCOUNT DETAILS</div>
                </div>
            </Header>
            <Content>
                <div id="titleAccountResults" runat="server" visible="true">
                    <div class="form-group">
                        <h6>Account Details:</h6>
                    </div>
                </div>

                <asp:DataList ID="DataListAccount" runat="server">
                    <ItemTemplate>

                        <tr>
                            <td style="width: 171px">Account Number:</td>
                            <td style="width: 220px">
                                <asp:Label ID="lblAccountNumber" runat="server" Text='<%# Eval("ACCOUNT_NUMBER") %>'></asp:Label>
                            </td>
                        </tr>
                        <asp:PlaceHolder ID="PlaceHolder36" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("ACCOUNT_STATUS").ToString()) ? true : false %>'>
                            <tr id="rowAccountStatusAccount">
                                <td style="width: 171px">Account Status:</td>
                                <td style="width: 220px">
                                    <asp:Label ID="lblAccountStatus" runat="server" Text='<%# Eval("ACCOUNT_STATUS") %>'></asp:Label>
                                </td>
                            </tr>
                        </asp:PlaceHolder>
                        <asp:PlaceHolder ID="PlaceHolder35" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("ACCOUNT_NAME").ToString()) ? true : false %>'>
                            <tr id="rowAccountNameAccount" runat="server">
                                <td style="width: 171px">Account Name:</td>
                                <td style="width: 220px">
                                    <asp:Label ID="lblAccountName" runat="server" Text='<%# Eval("ACCOUNT_NAME") %>'></asp:Label>
                                </td>
                            </tr>
                        </asp:PlaceHolder>

                    </ItemTemplate>
                </asp:DataList>

            </Content>
        </ajaxToolkit:AccordionPane>
    </Panes>
    <HeaderTemplate>
        <hr />
    </HeaderTemplate>
    <Panes>
        <ajaxToolkit:AccordionPane ID="AccordionPane2" runat="server">
            <Header>
                <div class="panel panel-default">
                    <div class="alertHeading" style="color: red; background-color: lightgray; font-weight: 700; padding: 1em; border-radius: 5px; border: dashed 1px; border-color: black;">PAYMENT DETAILS</div>
                </div>
            </Header>
            <Content>
                <div id="Div1" runat="server" visible="true">
                    <div class="form-group">
                        <h6>Contact Details:</h6>
                    </div>
                </div>

                <asp:DataList ID="DataListContact" runat="server">
                    <ItemTemplate>

                        <tr>
                            <td style="width: 171px">Account Number:</td>
                            <td style="width: 220px">
                                <asp:Label ID="lblAccountNumber" runat="server" Text='<%# Eval("ACCOUNT_NUMBER") %>'></asp:Label>
                            </td>
                        </tr>
                        <asp:PlaceHolder ID="" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("COMPANY_NAME").ToString()) ? true : false %>'>
                            <tr>
                                <td style="width: 171px">Company Name:</td>
                                <td style="width: 220px">
                                    <asp:Label ID="lblCompanyName" runat="server" Text='<%# Eval("COMPANY_NAME") %>'></asp:Label>
                                </td>
                            </tr>
                        </asp:PlaceHolder>
                        <asp:PlaceHolder ID="" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("COMPANY_ADDRESS").ToString()) ? true : false %>'>
                            <tr>
                                <td style="width: 171px">Address:</td>
                                <td style="width: 220px">
                                    <asp:Label ID="" runat="server" Text='<%# Eval("COMPANY_ADDRESS") %>'></asp:Label>
                                </td>
                            </tr>
                        </asp:PlaceHolder>
                        <asp:Repeater ID="rptPager" runat="server">
                            <ItemTemplate>
                                <asp:Button ID="lnkPage" class="btn btn-outline-primary" runat="server" Text='<%#Eval("Text") %>' CommandArgument='<%# Eval("Value") %>'
                                    CssClass='<%# Convert.ToBoolean(Eval("Enabled")) ? "page_enabled" : "page_disabled" %>'
                                    OnClick="Page_Changed" OnClientClick='<%# !Convert.ToBoolean(Eval("Enabled")) ? "return false;" : "" %>'></asp:Button>
                            </ItemTemplate>
                        </asp:Repeater>
                    </ItemTemplate>
                </asp:DataList>
            </Content>
        </ajaxToolkit:AccordionPane>
    </Panes>
</ajaxToolkit:Accordion></asp:Repeater></asp:Content>

Solution

  • I found the solution. Place the repeater inside separate content tags and within the accordion's content tags. Also, no need to call the repeater by an outside repeater through code behind as stated above. I removed the outside repeater. It's working now.

    <content>repeater goes here</content>