Question

I am back with a new question on my Collapsing table with Jquery row filters on click. The issue should be very simple for expert i think.
If you collapse the table you see “Fondos De Inversión” and “Sociedades”.

I have applied a Jquery filter on click to the two span class “fondos” and “sociedades”, so this is going to delete the “Fondos” rows (f) or “Sociedades” rows (s) depending on what you click. Untill here everything is fine, the problem is that i dont want any row displayed after i click Sociedades and then Fondos because obviously i want all the rows deleted.

hope the issue explanation is clear

how this can be achieved?

here my case : http://jsfiddle.net/hAv7P/17/

Answer 1

You’re not deleting anything, you’re just hiding and showing stuff, and toggle() seems like a better fit for what you’re doing:

$(function() {
    $('.accordion').on('show hide', function(e) {
        $(this).find('.accordion-toggle i').toggleClass('icon-arrow-down icon-arrow-up', 200);
    });

    $('.accordion-body').collapse();

    $(".fondos").on('click', function() {
        $("tbody .f").toggle();
    });

    $(".sociedades").on('click', function() {
        $("tbody .s").toggle();
    });
});​

FIDDLE