get row values from dynamically created html table in c# using jquery

Question

I'm trying to get cell value from table that i generate dynamically in c#. In the last column I'm populating dropdown list. On Event change of dropdown list in want to get value from particular row. At this moment, i'm unable to different between rows, and when the on change listener is fired, all the values from table are fetched.

Below is my code

PendingFiles.cs

Table tbl = new Table();
tbl.ID = "PendingTable";
tbl.Rows.Add(new TableRow());
tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableHeaderCell());
tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = "Name";
tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableHeaderCell());
tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = "Address";
tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableHeaderCell());
tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = "Email Address";
foreach (var item in DC.refermember)
{
 DropDownList drplst = new DropDownList();
 drplst.ID = Guid.NewGuid().ToString();
 drplst.Items.Add("--Select--");
 drplst.Items.Add("APPROVE");
 drplst.Items.Add("STUDENT");
 drplst.Items.Add("ARTS/MEDIA");
 drplst.Items.Add("INCOMPLETE");
 drplst.Attributes.Add("onchange", "handleDropDownEvents(this);");
 //Panel1.Controls.Clear();
 tbl.Rows.Add(new TableRow());
 //tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableCell());
 //tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = item.ReferId;
 //tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Enabled = false;
 tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableCell());
 tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = item.FirstName + " " + item.LastName;
 tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableCell());
 tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = item.FirstName + " " + item.LastName;
 tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableCell());
 tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Text = item.HomeAddress;
 tbl.Rows[tbl.Rows.Count - 1].Cells.Add(new TableCell());
 tbl.Rows[tbl.Rows.Count - 1].Cells[tbl.Rows[tbl.Rows.Count - 1].Cells.Count - 1].Controls.Add(drplst);
 Panel1.Controls.Add(tbl);
}

.aspx

function handleDropDownEvents(e) {
 //alert(e.value)
 //if (e.value == "APPROVE") {
 //var $table = $("#ctl00_ContentPlaceHolder1_PendingTable").find("tr")
 var $row = $(this).parents('tr'); //Here I have to change something
 var email = $row.find('td:nth-child(4)').text();
 var firstname = $row.find('td:nth-child(2)').text();
}

Answer 1

You put 'this' instead of 'e'! And I think using 'closest' would be better.

var $row = $(e).closest('tr');

Another suggestion:

TableRow row = new TableRow();
row.Cells.Add(new TableHeaderCell() { Text = "Name" });
row.Cells.Add(new TableHeaderCell() { Text = "Address" });
row.Cells.Add(new TableHeaderCell() { Text = "Email Address" });
tbl.Rows.Add(row);

• Salar Muhammad: thanks Sir, it worked! just a quick questions. How do i get selected value from dropdown from 'e' as i have used guid for every dropdown items. So i am unable to use this $('#ctl00_ContentPlaceHolder1_drpdownlst :selected').text()