ExtJS 4 - How to add background colors to columns of a grid?

Question

I have a grid in which I need to provide different background colors to various columns.

These column colors should also not be overwritten by the mouse-over color.

I have tried using cls and tdCls but no luck.

Could anyone guide at how this could be achieved?

Thanks in advance.

Answer 1

NetEmp is right here, you want a renderer and you want to use the direct 'style' method or I did it below using the following:

function greyRenderer(lpValue, opMeta, opData) 
{

    if (opData.data["Condition"] == 0) {
        opMeta.attr = "style='color: #aaa';";
    }

    lpValue = Ext.util.Format.htmlEncode(lpValue); 
    return lpValue;
}

Note here I check the value on the row in a particular field and then apply the colour to the foreground text and html encode the output, you can obviously just switch things to your specific requirements.