Removing rows from multiple tables with jQuery
I have a row of a nested table, each with a separate ID and multiple rows. On the first table (blank0) I have a deleteLink action
$(document).ready(function(){
$("#blank0 .deleteLink").on("click",function() {
var tr = $(this).closest('tr');
tr.fadeOut(400, function(){
tr.remove();
});
return false;
});
});
This removes the selected row as expected. I want to be able to do this in order to delete the same row in all of my tables. For example, if I click the 3rd delete button, I would like it to delete the third line from blank 0 to blank
+3
source to share
1 answer
I would give all tables a common class and use a property rowIndex
to filter <tr>
s.
$('.blank').on('click', '.deleteLink', function () {
var rowIndex = $(this).closest('tr').prop('rowIndex');
$('.blank tr').filter(function () {
return this.rowIndex === rowIndex;
}).remove();
});
Here is a demo: http://jsbin.com/yugurekiri/1/edit?html,js,output
+4
source to share