sara adly sara adly - 7 months ago 7
Javascript Question

Add A tag to html table clickable event

I have this table

which fills in c# as

foreach (Complains complainobj in lstrequest)
{
info += @"<tr> ";
info += @"<td '><strong>" + complainobj.ComplainId.ToString() + "</strong></td>";
info += @"<td '><strong>" + donorname + "</strong></td>";
info += @"<td '><strong> " + complainobj.ComplainDetails + "</strong></td>";
info += @"<td '><strong>" + complainobj.ComplainTitle + "</strong></td>";
info += @"<td '><div id='ComplainStatusID' style='float:right;display:block;'>"+
"<strong>" + complainobj.ComplainStatus + "</strong></div>"+
"<div id='ComplainStatusinputID' style='float:right;display:none;'>" +
"<input id='editstatus' type='text'/></div>"
+ "<div style='float:left;'><a href='javascript:void(0)' class='editstatusclass'> <span class='glyphicon glyphicon-pencil'></span></a></td>";
info += @"<td '><strong>" + complainobj.CompainNotes + "</strong></td>";
info += @"<td '><strong>" + complaintype + "</strong></td>";
info += @"</tr>";
}


When I add a tag as shown and try to handle it as

$("a.editstatusclass").on("click", function () {
$("#ComplainStatusID").css('display', 'none');
$("#ComplainStatusinputID").css('display', 'block');
});

$("#editstatus").blur(function () {
var compainId = $(this).parent().parent().siblings(":first").text();
alert(compainId)
});


it click the first row every time
what I already need it to create a tag for every row and get html DATA ROW values

Answer
 $("a.editstatusclass").on("click", function () {
          //  $("#ComplainStatusID").css('display', 'none');
           // $("#ComplainStatusinputID").css('display', 'block');
              $(this).closest("tr").find("#ComplainStatusID").css('display', 'none');
           $(this).closest("tr").("#ComplainStatusinputID").css('display', 'block');

        });
Comments