jQuery Delete from table

Question

Possible Duplicate:
Jquery Delete From Table

Basically take a look at this link text and you will get what the problem is.

Problem: Once you click delete on first category, category and all items (even not in that category) get deleted too.

Answer 1

The code is doing exactly what's it's supposed to do but not what you're expecting it to do. Consider this line:

$(this).parent().parent().nextAll("tr.item").fadeOut("fast");

This is selecting all the siblings of the row containing the delete link that have the item class, including sibling rows after a category row. Or, IOW, every row in the table is a sibling of the parent row, so every item row in the table will be selected.

One possible fix is to add another unique class to the item rows under each category. So HTML like this:

<tr class="category category1">...</tr>
<tr class="item category1">...</tr>
<tr class="item category1">...</tr>
...
...
<tr class="category category2">...</tr>
<tr class="item category2">...</tr>
<tr class="item category2">...</tr>

And then in the handler function select rows by the second identifying category:

$(this).parent().parent().nextAll(".category1").fadeOut("fast");

You can extract the second identifying class via $(this).parent().parent().attr('class')