Display details of HTML Table row on click using JavaScript and jQuery

Hi florenz,

I have created one sample Please check.

HTML

<div>
    <asp:PlaceHolder runat="server" ID="PlaceHolder1"></asp:PlaceHolder>
</div>
<div id="dvDetails">
</div>

Script

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    function GetDetails(link) {
        var row = $(link).closest('tr');
        var PatientId = $('td', row).eq(0).html();
        var PatientName = $('td', row).eq(1).html();
        var tableHtml = "<table><tr><td>PatientId :</td><td>";
        tableHtml += PatientId;
        tableHtml += "</td></tr><tr><td>PatientName :</td><td>"
        tableHtml += PatientName;
        tableHtml += "</td></tr></table>";
        $('[id*=dvDetails]').html("");
        $('[id*=dvDetails]').html(tableHtml);
        return false;
    }
</script>

 Code

protected void Page_Load(object sender, EventArgs e)
{
    List<Patient> patientList = new List<Patient>();
    patientList.Add(new Patient() { PatientId = 1, PatientName = "Patient1" });
    patientList.Add(new Patient() { PatientId = 2, PatientName = "Patient2" });
    patientList.Add(new Patient() { PatientId = 3, PatientName = "Patient3" });
    patientList.Add(new Patient() { PatientId = 4, PatientName = "Patient4" });
    patientList.Add(new Patient() { PatientId = 5, PatientName = "Patient5" });

    StringBuilder html = new StringBuilder();
    html.Append("<table id='patient-header'>");
    html.Append("<tr><th>Patient ID</th><th>Patient Name</th><th>Details</th></tr>");
    foreach (Patient p in patientList)
    {
        html.Append("<tr>");
        html.Append("<td>");
        html.Append(p.PatientId);
        html.Append("</td>");
        html.Append("<td>");
        html.Append(p.PatientName);
        html.Append("</td>");
        html.Append("<td>");
        html.Append("<a href=\"#\" id=\"" + p.PatientId + "\" onclick=\"GetDetails(this);\">Details</a>");
        html.Append("</td>");
        html.Append("</tr>");
    }
    html.Append("</table>");
    PlaceHolder1.Controls.Add(new Literal { Text = html.ToString() });
}

Screenshot