How to change the background color of a row in JQGrid?

 To change the background color of a row in JQGrid based on a condition, you can use a custom row formatter. Here are the steps:

1. Define a custom row formatter function that takes two parameters: rowid and rowdata.
2. Inside the formatter function, check the condition that you want to apply to the row. If the condition is met, set the background color of the row using jQuery.
3. Return the formatted row as an array with two elements: the first element is an empty string (since we don't want to change the content of the row), and the second element is the CSS class name that sets the background color.

Here is an example of a custom row formatter function that changes the background color of a row to red if the row data contains a negative value:

javascript
function customRowFormatter(rowid, rowdata) {
  for (var i = 0; i < rowdata.length; i++) {
    if (rowdata[i] < 0) {
      return ['', 'jqgrid-negative-row'];
    }
  }
  return ['', ''];
}

To use this custom row formatter in your JQGrid, set the rowattr property of the options object to the name of the formatter function:

javascript
$('#myGrid').jqGrid({
  url: 'mydata.json',
  datatype: 'json',
  colModel: [
    { name: 'id', index: 'id', width: 50 },
    { name: 'name', index: 'name', width: 200 },
    { name: 'value', index: 'value', width: 100 },
  ],
  loadComplete: function(data) {
    $('#myGrid').jqGrid('setGridParam', {rowattr: customRowFormatter}).trigger('reloadGrid');
  }
});

This will apply the custom row formatter to all rows in your JQGrid, changing the background color of any row that contains a negative value to red. The CSS class jqgrid-negative-row is used to set the background color. You will need to define this class in your CSS file.