Question

I have a demo on the following link:

http://mywebbapp.com/tableSortingDemo.html

When you click on the Status column and start sorting and then click on the pagination arrow to go to page 2 the rows don’t alternate color until you click on the Status column again. Is there a script I can write to resolve this?

Answer 1

Yes, though I suggest using a premade table such as DataTables.

Here’s a small jQuery plugin that could be used if you can trigger it when you paginate:

jQuery.fn.stripe = function() {
    $(this).find('tr').removeClass('even odd').filter(':odd').addClass('odd').end().find('tr:even').addClass('even');
}

$('#table').stripe();

Then be sure to have some CSS that changes the color:

tr.odd { background: #fff }
tr.even { background: #ddd }