display image in a grid using extjs

Question

I am new to extjs. I want to display icon images for each grid elements. can you please help me anybody?

I am getting the image path from an xml file.

My cod

Answer 1

Another alternative that could be adopted to your particular question would be to setup the images in the CSS file like:

.icon-red {
    background-image:  url('red.png');
    background-repeat: no-repeat;
}

.icon-green {
    background-image:  url('green.png');
    background-repeat: no-repeat;
}

Then create a render to add to the cell metadata as it is rendered:

renderIcon: function(value, metadata, record, rowIndex, colIndex, store) {

    // set the icon for the cells metadata tags
    if (value > 0) {
        metadata.css = metadata.css + ' icon-green ';
    } else {
        metadata.css = metadata.css + ' icon-red ';
    }

    // add an individual qtip/tooltip over the icon with the real value
    metadata.attr = 'ext:qtip="' + (value) + '"';

    return ' ';
}