asprin
asprin

Reputation: 9833

Target Dynamically Added <tr>

I've with me the feature of adding new rows to an existing table via the "Add Row" button using plain old javascript. This code was written by someone else and now I'm required to add something more to the existing functionality.

For that reason I need to be able to target the dynamically added rows too but for some reason whenever I do (after adding 2-3 new rows and clicking "Submit" button)

console.log($('table#tableid tbody tr').length);

it is only retuning the number of rows which were loaded during the page load and skipping the new rows that were added dynamically.

Here's the Fiddle to get you started. It's baffling really because I thought I knew jQuery well enough to be stumped by this....

Upvotes: 0

Views: 48

Answers (2)

Vipul Kumar
Vipul Kumar

Reputation: 416

At page Load you are having rows in tbody.while the rows you are adding dynamically are adding in .while on button click you are selecting only those rows that are coming in tbody section.

Upvotes: 0

weeklyTea
weeklyTea

Reputation: 345

You add new row to tfoot. Try this:

var tbl = document.getElementById('tblSample').getElementsByTagName('tbody')[0];

Upvotes: 1

Related Questions