How can I change the row colour in datagrid based on severity?

Question

How can I change the row colour in datagrid based upon the severity condition? I\'m new to this EXTJS topic. I used to reader to read, store to store and writer to write the

Answer 1

You could use a renderer for your column from your column model and then assign a css class like this:

so, the customRenderer function:

`

function customRenderer(value, metaData, record, rowIndex, colIndex, store) {
    var opValue = value;
    if (value === "Rejected") {
        metaData.css = 'redUnderlinedText';
    } else if (value === "Completed") {
        metaData.css = 'greenUnderlinedText';
    } else if (value === "Started") {
        metaData.css = 'blueUnderlinedText';
    }
    return opValue;

}`

And then your column:

        {
            header: 'Your Column Header',
            dataIndex: 'your_data_index',
            renderer: customRenderer
        }

Then your css could be like this:

.redUnderlinedText {
    background-color: blue,
    color: red;
    text-decoration: underline;
    cursor: pointer;
}