How to use an UpdatePanel inside a Reapeater ItemTemplate with a HTML Table

Question

I want to allow the user to edit by data by row, so only need content updated by row. I managed to achieve this by using a Repeater with a UpdatePanel in the ItemTemplate.

Using a Div

<asp:ScriptManager ID="ctlScriptManager" runat="server" />
<asp:Repeater ID="ctlMyRepeater" runat="server">
    <ItemTemplate>
        <div>
            <asp:UpdatePanel ID="ctlUpdatePanel" runat="server">
                <ContentTemplate>
                    <asp:Label ID="lblName" runat="server"
                        Text='<%# Eval("Name") %>' />
                    <asp:LinkButton ID="btnRename" runat="server"
                        CommandArgument='<%# Eval("ID") %>'
                        CommandName="Rename">Rename...</asp:LinkButton>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnRename" 
                        EventName="Click" />
                </Triggers>
            </asp:UpdatePanel>
        </div>
    </ItemTemplate>
</asp:Repeater>

But, I want to use a table to ensure structure and spacing and CSS styling wasn't doing it for me, but when I use a table everything goes whacky.

Using a Table

<asp:ScriptManager ID="ctlScriptManager" runat="server" />
<table>
    <asp:Repeater ID="ctlMyRepeater" runat="server">
        <ItemTemplate>
            <asp:UpdatePanel ID="ctlUpdatePanel" runat="server">
                <ContentTemplate>
                    <tr>
                        <td>
                            <asp:Label ID="lblName" runat="server"
                                Text='<%# Eval("Name") %>' />
                        </td>
                        <td>
                            <asp:LinkButton ID="btnRename" runat="server"
                                CommandArgument='<%# Eval("ID") %>'
                                CommandName="Rename">Rename...</asp:LinkButton>
                        </td>
                    </tr>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnRename"
                        EventName="Click" />
                </Triggers>
            </asp:UpdatePanel>
        </ItemTemplate>
    </asp:Repeater>
</table>

What's the best way to solve this problem? I prefer using a table, because I really want to enforce structure without reliance on CSS.

Thanks in advance.

Answer 1

Three thoughts that may help....

1. Move the update panel to outside the repeater control instead of in the template...
2. Use the ListView Control but again moving the panel outside of the template...
3. Perhaps showing us the CSS you have tried on the div's and what you want so we can help will get you working with your first sample using divs again...