Change Background Color of Cell in Datatable.

codemonkey65

I am using the following code to alter the background of one cell in the row based on the value of a different cell in the table.

"fnRowCallback": function (nRow, aaData) {
if ($('#ddlViews').val() == "MC" || $('#ddlViews').val() == "MCL" || $('#ddlViews').val() == "MCD") {
if (aaData[56] == "CLOSED") {
jQuery($(nRow).children("td").get(3), nRow).addClass('orderClosed');
}
}
}

The table columns are defined as follows:

"aoColumns": [
{ "sTitle": "Priority", "sWidth": "5px", "fnRender": function (oObj) {
return '';
}
}, // Column 0
{ "sTitle": "BTO", "sWidth": "5px", "fnRender": function (oObj) {
var checked = "";
if (oObj.aData[1] == "X") checked = 'checked="checked"';
return '';
}
}, // Column 1
{"sTitle": "MC #", "sWidth": "40px" }, // Column 2
{"sTitle": "Order #", "sWidth": "25px" }, // Column 3
{"sTitle": "Site", "sWidth": "25px" }, // Column 4
{"sTitle": "Seq. #", "sWidth": "15px" }, // Column 5
{"sTitle": "PO #", "sWidth": "50px" }, // Column 6
{"sTitle": "Order Date", "sWidth": "25px" }, // Column 7
{"sTitle": "Load Date", "sWidth": "25px" }, // Column 8
{"sTitle": "Ship Date", "sWidth": "25px" }, // Column 9
]
})

This all works as anticipated until I hide several columns on the table with the following code:

function hideColumns(viewName) {
getColumnArray(viewName);
}

function getColumnArray(viewName) {
var service = new webService(url);
service.getColumnArray(viewName, function (items) {
var columns = items;
var table = $('#grdLoadingData').dataTable();
for (var i = 0; i < columns.length - 6; i++) {
table.fnSetColumnVis(columns[i], false, false);
}
table.fnDraw();
});

}

Once the getColumnArray function is complete, the table displays with the correct column with the appropriate background color and then an additional column also showing with a red background.

I suspect that the class is being applied to the correct column of the table on the original table configuration, but when I hide columns, it tries to apply the class to the literal column being displayed (in this case Column 7) as well as the column defined as Column 3 prior to hiding columns.

I hope this post isn't too vague but I am unsure how to resolve this issue. Since I am working in a development environment, I am unable to show all the code. I hope the snippets I've provided are enough.