ASP .NET Repeater inside Repeater

Question

I am trying to create a child Repeater inside of a parent Repeater in an *.aspx page.

I have a small problem which i can't figure out how to resolve. (I will show in the attached image)

The table i am creating is displayed as a single row

The code is bellow:

<asp:Panel ID="pnlUserActionSummary" runat="server" Visible="false">
    <h3><b>User Actions</b></h3>
    <hr/>

    <asp:Repeater id="UserActionDetailsRepeader" runat="server" OnItemDataBound="UserActionDetailsRepeadetItemBound">
        <ItemTemplate>
            <h3><b><asp:Literal ID="lit1" runat="server" Text='<%# Eval("PhaseDisplayName") %>'></asp:Literal></b></h3>

            <asp:Literal ID="lu1" runat="server" Text="Started On: "></asp:Literal> 
            <asp:Literal ID="lu2" runat="server" Text='<%#Eval("PhaseStartedOn")%>'></asp:Literal>

            <br/>
            <asp:Literal ID="lu3" runat="server" Text="Status: "></asp:Literal> 
            <asp:Literal ID="lu4" runat="server" Text='<%# Eval("PhaseStatus") %>'></asp:Literal>

            <br/>
            <br/>                                

            <asp:Repeater ID="TaskDetailsRepeater" runat="server">
                <HeaderTemplate>
                    <table>
                        <thead>
                            <tr>
                                <th><asp:Literal ID="l1" runat="server" Text="User"></asp:Literal></th>
                                <th><asp:Literal ID="l2" runat="server" Text="Status"></asp:Literal></th>
                                <th><asp:Literal ID="l3" runat="server" Text="Completed On"></asp:Literal></th>
                                <th><asp:Literal ID="l4" runat="server" Text="Comment"></asp:Literal></th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr runat="server" id="itemPlaceholder">
                            </tr>
                        </tbody>
                    </table>
                </HeaderTemplate>

                <ItemTemplate>
                    <tr>
                        <td><%#DataBinder.Eval(Container.DataItem, "UserName")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "Status")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "CompletedOn")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "Comment")%></td>
                    </tr>
                </ItemTemplate>
            </asp:Repeater>

            <br />
            <br />
        </ItemTemplate>
    </asp:Repeater>

    <br />
</asp:Panel>

Can you suggest me please how can I change the code in order to have a real table, not a simple line.

The collections I bind:

    private void PlaceToBindParentDataSource()
    {        
        UserActionDetailsRepeader.DataSource = UserActions;
        UserActionDetailsRepeader.DataBind();
    }        

    protected void UserActionDetailsRepeadetItemBound(object sender, RepeaterItemEventArgs args)
    {            
        Repeater childRepeater = (Repeater)args.Item.FindControl("TaskDetailsRepeater");

        var boundItem = (UserActionsDetails)args.Item.DataItem;
        var userAction = UserActions.FirstOrDefault(x => x.Key.Equals(boundItem.Key));
        var itemTaskDetails = userAction.TaskDetails;

        childRepeater.DataSource = itemTaskDetails;
        childRepeater.DataBind();              
    }

    protected List<UserActionsDetails> UserActions;

    public class UserActionsDetails
    {
        public Guid Key { get; set; }
        public string PhaseDisplayName { get; set; }
        public string PhaseStatus { get; set; }
        public string PhaseStartedOn { get; set; }
        public List<TaskDetails> TaskDetails { get; set; }
    }

    public class TaskDetails
    {
        public string UserName { get; set; }
        public string Status { get; set; }
        public string CompletedOn { get; set; }
        public string Comment { get; set; }
    }

Thanks.

Magnus Magnus · Accepted Answer · 2015-02-06T08:41:19

If you leave <tbody> unlosed in HeaderTemplate and add a FooterTemplate that closes it and the table it should work.

 <asp:Repeater ID="TaskDetailsRepeater" runat="server">
                <HeaderTemplate>
                    <table>
                        <thead>
                            <tr>
                                <th><asp:Literal ID="l1" runat="server" Text="User"></asp:Literal></th>
                                <th><asp:Literal ID="l2" runat="server" Text="Status"></asp:Literal></th>
                                <th><asp:Literal ID="l3" runat="server" Text="Completed On"></asp:Literal></th>
                                <th><asp:Literal ID="l4" runat="server" Text="Comment"></asp:Literal></th>
                            </tr>
                        </thead>
                        <tbody>
                </HeaderTemplate>
                <ItemTemplate>
                    <tr>
                        <td><%#DataBinder.Eval(Container.DataItem, "UserName")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "Status")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "CompletedOn")%></td>
                        <td><%#DataBinder.Eval(Container.DataItem, "Comment")%></td>
                    </tr>
                </ItemTemplate>
                <FooterTemplate>
                    </tbody>
                    </table>
                </FooterTemplate>
            </asp:Repeater>

ASP .NET Repeater inside Repeater

1 Answers