Table row onclick event that runs codebehind - asp.net

Question

I've inherited an ASP.NET project that has poorly designed HTML; in one section, the <TR> tags are wrapped with an tag to allow for "click the row to view the information" functionality. The code is:
<asp:LinkButton ID="ViewArticle" runat="server" CommandName="Navigate" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "id") %>' >
<tr runat="server" class="list_item">
<td>some data</td>
<td>some data</td>
<td>some data</td>
</tr>
</asp:LinkButton>
I'd like to do something like:
<tr runat="server" class="list_item" onclick="doRowPostbackFunction('<%# DataBinder.Eval(Container.DataItem, "id") %>');">
<td>some data</td>
<td>some data</td>
<td>some data</td>
</tr>
How do I go about tying a JavaScript onclick event to the codebehind?

Answer 1

Using jQuery you can do the following and trigger a postback:
<table>
<tr id="1">
<td>AAA</td>
<td>BBB</td>
<td>CCC</td>
</tr>
<tr id="2">
<td>AAA</td>
<td>BBB</td>
<td>CCC</td>
</tr>
<tr id="3">
<td>AAA</td>
<td>BBB</td>
<td>CCC</td>
</tr>
</table>
<script type="text/javascript">
$(function () {
$("table tr").click(function (e) {
//alert the row index that was clicked
alert($("table tr").index(this));
//alert the id of the row
alert($(this).attr("id"));
//submit the form...
});
});
</script>
OR use the onclick event of the row...
<tr onclick="doPostBack('<%#DataBinder.Eval(Container.DataItem, "id") %>')">
...and trigger a javascript function.
<script type="text/javascript">
function doPostBack(id)
{
//submit form
}
</script>

Answer 2

You could make your page (or control, if that's inside a control) implement IPostBackEventHandler interface and use ClientScriptManager.GetPostBackEventReference method (using Page.ClientScript propery to get a reference to ClientScriptManager) to get a js-method-call-string which will make a postback to your page. As a control argument to GetPostBackEventReference method use your page.
Then set onclick property of tr to that js-method-call-string.
Example
In aspx:
<table>
<tr onclick="<%= _jsPostBackCall %>;">
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
</table>
<h1>
<asp:Literal ID="litMessage" runat="server" />
</h1>
In codebehind:
public partial class _Default : System.Web.UI.Page, IPostBackEventHandler
{
protected String _jsPostBackCall;
protected void Page_Load(object sender, EventArgs e)
{
// "myTr" will be passed as an argument to RaisePostBackEvent method
_jsPostBackCall = ClientScript.GetPostBackEventReference(this, "myTr");
}
public void RaisePostBackEvent(string eventArgument)
{
switch (eventArgument)
{
case "myTr":
HandleTrClick();
break;
// you can add other controls that need postback processing here
default:
throw new ArgumentException();
}
}
private void HandleTrClick()
{
litMessage.Text = "Tr clicked.";
}
}

Answer 3

You can simply use
__doPostBack(eventName, eventArgs);
Here eventName is code-behind event handler