How can we update a table row using updatepanel?

How can we update a table row using updatepanel? In my example, The whole table is being updated.

<

asp:UpdatePanelID="upLevel1"runat="server"UpdateMode="Conditional">

<ContentTemplate>

<tableborder="1px"><tr><tdstyle="font-size: medium"><asp:LinkButtonID="LinkButton5"runat="server">LinkButton</asp:LinkButton>

<%

=DateTime.Now %></td><td>

<%

=DateTime.Now %></td></tr><asp:UpdatePanelID="upLevel2"runat="server"UpdateMode="Conditional">

<ContentTemplate>

<tr><tdstyle="font-size: medium"><asp:LinkButtonID="LinkButton7"runat="server">LinkButton</asp:LinkButton>

<%

=DateTime.Now %></td><td>

<%

=DateTime.Now %></td></tr></ContentTemplate></asp:UpdatePanel><tr><tdstyle="font-size: medium"><asp:LinkButtonID="LinkButton6"runat="server">LinkButton</asp:LinkButton>

<%

=DateTime.Now %></td><td>

<%

=DateTime.Now %></td></tr></table>

</ContentTemplate></asp:UpdatePanel>

the whole table gets updated because your table is inside the updatepanel. which table row do you want to update? and i assume clicking those Linkbutton will update your row?

Hello,

it seems that you have updatepanels as a direct child of a <table>. This will result illegal markup (rendermode of updatepanel doesn't matter)...

You need something similar which yields to valid markup and I think should works:

<tr><td>Updatepanel here</td></tr>
<tr><td>Updatepanel here</td></tr>
<tr><td>Updatepanel here</td></tr>

In the real app that we are working, the table contains a lot of controls(labels, Input Controls, Grids) and a business rule needs to update a row. I'm trying to optimize the performance especially minimizing the response size to increase the speed of the transmission from server to client.

In my example below, the upLevel2 does not work. I guess update panel does not work in this way. I hope you guys can give me a fix/suggestion on how to best implement this.

Thanks

<asp:LinkButton ID="LinkButton8" runat="server" OnClick="LinkButton8_Click">Toggle 2nd Row Visibility</asp:LinkButton>
<asp:UpdatePanel ID="upLevel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table border="1px">
<tr>
<td style="font-size: medium">
<asp:LinkButton ID="LinkButton5" runat="server">Update Table </asp:LinkButton>
<%=DateTime.Now %>
</td>
<td>
<%=DateTime.Now %>
</td>
</tr>
<asp:UpdatePanel ID="upLevel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<tr runat="server" id="tr2">
<td style="font-size: medium">
<asp:LinkButton ID="LinkButton7" runat="server">Update this Row</asp:LinkButton>
<%=DateTime.Now %>
</td>
<td>
<%=DateTime.Now %>
</td>
</tr>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="LinkButton8" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<tr>
<td style="font-size: medium">
<asp:LinkButton ID="LinkButton6" runat="server">Update Table </asp:LinkButton>
<%=DateTime.Now %>
</td>
<td>
<%=DateTime.Now %>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>

protected void LinkButton8_Click(object sender, EventArgs e)
{
tr2.Visible = !tr2.Visible;
}

for your LinkButton8 to work, you need to add a Trigger to your UpdatePanel:

<asp:UpdatePanelID="upLevel1"runat="server"UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTriggerControlID="LinkButton8"EventName="Click"/>
</Triggers>
...

Every row that you want to update independently, you need to put it in its own Updatepanel. The link button needs to be outside and set the trigger to it. LinkButton8 is a good example that you can follow.

The updatepanel renders as a div or a span element. Because the div and span is an illegal child of the table element, I think your sample won't work. Put the updatepanels inside the td elements. If you want to use updatepanel for hide/show, remove,add or update acomplete tr , I suppose that is not possible (I'm not sure about this, but seems logical). However you can achieve this using javascript or you can change the page layout (do not use table, use divs instead of).

( Currently your example renders the following illegal html:

<table>

<tr> ... </tr>

<div> <-- not valid html, rendered by the upLevel2 updatepanel

<tr> ... </tr>

</div>

<tr> ... </tr>

</table> )