CODEWITHSUNDEEP
jqueryhtml
Manindra Singh
Manindra Singh

Reputation: 769

unable to remove the specific row from a table through jquery

i m using jquery to add new row and delete them but my problem is that when i click on minus button it start deleting the row from bottom to up and not delete the particular row.means if i filled the data in 10 rows and now want to delete the 5th row then on cliking minus button on 5th row it removes 10th, 9th and so on...and i want that only 5th row will bdeletedhow could it will b possible.

Here is my jquery file:

$(document).ready(function(e) {
    $("#add").click(function() {
        $('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
        var last_sn = $('#mytable tbody>tr:last>td:first').html();
        $('#mytable tbody>tr:last>td:first').html(parseInt(last_sn) + 1);
        return false;
    });
    $('#minus').click(function() {
        $('#mytable tr:last-child').remove();
    });
});​

Upvotes: 0

Views: 277

Answers (3)

bang
bang

Reputation: 5221

$('#mytable tr:last-child').remove(); will allways remove the last row.

If you have several minus buttons then you should not use the same id (#minus) use a class instead.

fiddle: http://jsfiddle.net/k8dAs/

$('.minus').click(function()
{
  $(this).parents("tr").remove();
});

Upvotes: 0

JoeFletch
JoeFletch

Reputation: 3960

This $('#mytable tr:last-child').remove(); should be

$(this).closest("tr").remove();

Upvotes: 0

Sang Suantak
Sang Suantak

Reputation: 5265

Do this instead:

$('#minus').click(function() {
    $(this).closest("tr").remove();
});​

Your code $('#mytable tr:last-child').remove(); will always remove the last row. Also, you should make minus a class instead since it will be replicated for multiple rows leading to multiple elements with same id.

Upvotes: 1

Related Questions