[Fixed]-Getting data from dynamically added table rows

by

1👍

Assuming you have a table like this:

<table id="products">
<tbody>
<tr><td><input type="text" class="productid"></td><td><input type="text"></td><td><input type="text"></td></tr>
<tr><td><input type="text" class="productid"></td><td><input type="text"></td><td><input type="text"></td></tr>
</tbody>
</table>

You would attach a listen event to the class:

$( "#products .productid" ).on( "change", function() {
 // do your AJAX here
});

You can pass $(this) to the callback function on the AJAX response to get the row. From there, you can jump to the 2nd, 3rd column.

$(this).closest('tr').find('td:nth-child(2) input').val(x) // Insert value for second column
$(this).closest('tr').find('td:nth-child(3) input').val(y) // Insert value for third column

And any blank new row you add will have the same functionality if the input has a class of .productid

👤omnichad

Leave a comment