Extjs 4 grid: place icon in cell according to store text value

extjs4, grid, javascript

Solution

It is as easy as:

return '<img src="..." />';

Or if you prefer the css way, you can do:

renderer: function( value, metadata, record )
{
    metadata.tdCls = 'yes-icon'
}

Problem

I have a store with a field that has either "Y" or "N" in it. I would like to take that Y or N value and place a little green or red icon in the grid instead of the text. I have been messing around with a conditional rendering function but I can't figure out how to get an icon to appear according to the value. So far I have ``` initComponent: function() { this.columns=[ {header: 'PreReq', dataIndex: 'PreReq', width: 50, renderer: function(value){ if(value == 'Y'){ //some code to put green icon in this cell } else if(value =='N'){ //come code to put red icon in this cell } else{ //some code to put error icon in this cell } } } ]; this.callParent(arguments); } ```

Original source