I am working on jquery table from this table i get row data using checkbox, i have some textboxes in this table here is problem with these textboxes when i checked first row the values in the textboxes get correctly and then when i checked the 2nd row the td text changed but the textbox values of 2nd row does not change it remain same as on first one row, i want to get the proper values of each row help me with it.
Jquery Table This is how i populate it
$.each(list, function (key, value) {
var html = $(
'<tr>' +
'<td>' + value.Id + '</td>' +
'<td>' + value.FeeHeadName + '</td>' +
'<td>' + value.SchoolName + '</td>' +
'<td>' + value.ClassName + '</td>' +
'<td>' + value.Amount + '</td>' +
'<td>' + "<input type='text' name='Paid' id='paid'/>" + '</td>' +
'<td>' + "<input type='text' id='Discount' name='Discount' />" + '</td>' +
'<td>' + "<input type='text' id='NetAmount' name='NetAmount' />" + '</td>' +
'<td>' + "<input type='checkbox' class='ckb'/>" + '</td>' +
'</tr>');
$("#view").append(html);
html = '';
});
I have attached the table image
How i get the values
$('#view').on('click', 'input[type="checkbox"]:checked', function () {
var row = $(this).closest('tr');
var id = row.find('td:eq(0)').text();
var fname = row.find('td:eq(1)').text();
var sname = row.find('td:eq(2)').text();
var cname = row.find('td:eq(3)').text();
var amount = row.find('td:eq(4)').text();
var paid = $('#paid').val();
var discount = $('#Discount').val();
var netAmount = $('#NetAmount').val();
info.push({
Fee_Id: id,
FeeHeadName: fname,
sname: sname,
cname: cname,
Amount: amount,
Paid: paid,
Discount: discount,
NetAmount: netAmount
});
console.log(info);
});
you need to get the input's value from the row :
var paid = row.find('#paid').val();
var discount = row.find('#Discount').val();
var netAmount = row.find('#NetAmount').val();
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.