user1016403
user1016403

Reputation: 12621

Insert row dynamically in html using jquery?

I am using below the code to insert a row dynamically in html table.

var newRow = jQuery('<tr><td><input style="width:200px" type="text" name="designation' +
counter + '"/></td><td><input style="width:200px" type="text" id="start_date'+ counter +'" name="start_date' +
        counter + '"/></td><td><input style="width:200px" id="end_date'+ counter +'" type="text" name="end_date' +
        counter + '"/></td></tr>');
    jQuery('table.authors-list').append(newRow);

This code works fine. The row is always inserted as last row. But i need to insert the row just before the last row. I mean if the table has 3 rows, then new row should be in 3rd place the row which was there in 3rd place should be moved to last. How can i achieve this? Please help me.

Thanks!

Upvotes: 1

Views: 3560

Answers (2)

xborus
xborus

Reputation: 13

$('table tr:last').before($('<tr>....</tr>'))

Upvotes: 0

palaѕн
palaѕн

Reputation: 73946

You can use the .before() method here like :

jQuery('table.authors-list tr:last').before(newRow);
  • tr:last will get the last row in the authors-list table.
  • .before() will insert the new row before the last one.

Upvotes: 4

Related Questions