Datatables: keep zebra stripes after hiding / showing table rows

Question

I am hiding rows dynamically in a table ('myTable') based based on manually added classes ('myClass'). The table uses the Datables plugin with the standard zebra-striped background colors.

Is there a way to keep these zebra stripes after manually hiding rows in that table ?

This works fine when sorting and filtering the table by using the standard Datatables functions so I assume there is a setting that allows this.

I am using a simple Show / Hide function based on a class that I add manually:

$('.myClass').hide(); / $('.myClass').show();

Can someone here help me with this ?

Many thanks in advance, Tim.

Answer 1

I use datatables as well. Love it but dont use the added classes for 'zebra stripes' lol.

If your users are past IE8 you could just let CSS do it like so:

tr:nth-child(even) {
    background-color: #000000;
}

EDIT: Based on comment. If you will be hiding rows rather than removing them jQuery is the best answer. Note the ":visible" in the selector. Using addClass would be a better call hence we could removeClass from the tr selector before we stripe the table.

Or use jQuery:

$(document).ready(function()
{
    $("tr:visible:even").css("background-color", "#000000");
});