alternate background row in jqgrid

Question

how can i add alternate background row in jqgrid?

Answer 1

Here's how you do it:

$("#myGrid").jqGrid({
   ...
   gridComplete: function() {
       var _rows = $(".jqgrow");
       for (var i = 0; i < _rows.length; i += 2) {
           _rows[i].attributes["class"].value += " alt";
       }
   }
});

Answer 2

Look at the altRows and altclass options. Beware of the typically inconsistent capitalization!

Answer 3

if you need to perform this dynamically (like when using the sortableRows functionality) you can call these two lines to reset the alternate color based on the jQueryUI css scheme:

$('#'+gridName+' tr:nth-child(even)').removeClass("ui-priority-secondary");
$('#'+gridName+' tr:nth-child(odd)').addClass("ui-priority-secondary");