Search code examples
jqueryhtmlhtml-tableexpand

jExpand not for the whole table; just for some lines


I'm trying to use jExpand (http://www.jankoatwarpspeed.com/expand-table-rows-with-jquery-jexpand-plugin/) just for some lines of my table, not the every lines !

You can see here on the demo link :

http://www.jankoatwarpspeed.com/wp-content/uploads/examples/expandable-rows/

You can expand every line (every country) to get more informations.

I my case I want to make expandable just some lines not every lines.

For example I want to make expandable just "United Kingdom" and "India" lines.

How i need to do ?

I tried to delete div class="arrow"></div> but we still can expand the line :/


Solution

  • Add a class to the rows that you don't want to expand and ignore them in the script.
    In my example I added the class .nope.

    $("#report tr:odd:not(.nope)").addClass("master");
    $("#report tr:not(.master, .nope)").hide();
    $("#report tr:first-child").show();
    $("#report tr.master").click(function(){
        $(this).next("tr").toggle();
        $(this).find(".arrow").toggleClass("up");
    }); 
    

    TEST IT HERE