I have the following popup Grid logic below:
dataModelTransaction= {
location: "remote",
dataType: "jsonp",
method: "GET",
url: "/CCRSearch/Reports/
[email protected]",
}
colModelTransaction = [
{ title: "FAS Activity", width: 120, dataIndx: "FASActivity" },
{ title: "TRAN_TYPE", hidden: true, width: 100, dataIndx: "TRAN_TYPE" },
{ title: "Source", width: 40, dataIndx: "Source" },
{ title: "Account Code", width: 40, dataIndx: "ACCNT_CODE" },
{ title: "Date", width: 40, dataIndx: "JCDATE" },
{ title: "Description", width: 150, dataIndx: "FASDesc" },
{
title: "Amount", width: 85, align: "right", dataIndx: "AMOUNT",
cellClass: function (ui) {
return ui.cellData < 0 ? "red-cell" : "";
}
} ]
function OpenTranWindow(Activity) {
$.post("/CCRSearch/Reports/GetTransactions?=", { "ActivityId": Activity}, function (data) {
$("#Transactiondetails").html(data);
$("#grid_transactions").pqGrid({
height: 450,
scrollModel: { autoFit: true },
dataModel: dataModelTransaction,
colModel: colModelTransaction,
pageModel: { type: "local", rPP: 1000, strRpp: "" },
numberCell: { show: false },
title: "Transaction Details",
resizable: true,
rowClass: function (ui) {
if (ui.rowData.TRAN_TYPE == "B") {
return "red-row"; // Apply a custom CSS class
}
} });
modal1.show();
});
}
I also have this style section in the html code above the javascript code:
<style>
.red-row {
background-color: red !important;
color: white !important;
}
.red-cell {
background-color: red !important;
color: white !important;
}
</style>
I am trying to set the entire row Red, if the hidden column, TRAN_TYPE = "B". I am also trying to set the Amount column to Red if it is a negative value.
Can you tell me what I am doing wrong?