After analyzing the code and output in firebug, I can filter the td and assign a different background color based on certain conditions.
Here is the code snippet:
loadComplete: function() {
var i, names=this.p.groupingView.sortnames[0], l = names.length;
for (i=0;i<l;i++) {
if (names[i]==='envVariable') {
$(this).jqGrid('groupingToggle',this.id+"ghead_"+i);
} else {
// hide the grouping row
$('#'+this.id+"ghead_"+i).hide();
}
}
var getColumnIndexByName = function(grid, columnName) {
var cm = grid.jqGrid('getGridParam','colModel'),i=0,l=cm.length;
for (; i<l; i++) {
if (cm[i].name===columnName) {
return i; // return the index
}
}
return -1;
};
var iCol = getColumnIndexByName($(this),'isEqual'),
cRows = this.rows.length, iRow, row, className;
for (iRow=0; iRow<cRows; iRow++) {
row = this.rows[iRow];
className = row.className;
if ($.inArray('jqgrow', className.split(' ')) > 0) {
console.info(row.cells[iCol]);
$(row.cells[iCol])
.filter("false")
.css("background", "#c8ebcc",
"background-color", "#DCFFFF",
"background-image", "none");
}
}
}
**Updated**
@Oleg: To achieve the functionality of hiding rows where isEqual is true and changing background color for rows where isEqual is false, I modified your code. However, it does not hide the rows as expected. Can you help me figure out where I went wrong?
var i, l, data = this.p.data, rows = this.rows, item;
l = data.length;
for (i=0;i<l;i++) {
item = data[i];
if (!item.isEqual) {
$(rows.namedItem(item._id_))
.css({
"background-color": "#DCFFFF",
"background-image": "none"
});
}
else
{
$(rows.namedItem(item._id_)).hide();
}
}