Set value in a jqgrid cell based on the value of another jqgrid cell

Question

I've got a coulmn STATUS in my jqgrid.

If the status is Active I want another cell in the same row to be green. If the status is Not Active I want the cell to be red.

How can this be done?

As of now I've created a custom formatter on the "image" row:

formatter: function () { return "<img src='../images/red.png'/>" }

Answer 1

There are different ways how you can implement it in jqGrid:

• the usage of cellattr to set class or style of the cell (see here or here)
• the usage of custom formatter (see here)
• the usage of setCell (see here)
• the usage of beforeProcessing method to modify the data returned from the server. In the way you can implement any calculated column. The value of the column could be HTML fragment if required.

I would recommend you to use cellattr or beforeProcessing approach or combination of both. You can consider to use background images instead of <img>. The most advantage of the cellattr approach is that you can place additional information like color inside of the cell having another data formatted with the corresponding formatter. So you can continue to use 'number' or 'date' formaters and have in the same cell some color effects.

The CSS possibilities are very powerful. As an example I can reference the answer which demonstrate how to implement nice gradient effects.

In any way I recommend you to read the answer which discuss advantages and disadvantages of setting different styles and classes on the cell.