Posted By

jvandemerwe on 09/23/10

Tagged

Versions (?)

Last Edited at 09/23/10 10:00am

Statistics

Viewed 1589 times

Favorited by 1 user(s)

Related snippets

Extjs : render a cell in grid with a custom class, based on criteria of other field

/ Published in: JavaScript

Highlighted TextExpand

// Target =
// to add a green marker to the record that we changed latest in the grid. This is shown after
// the grid is reloaded. So a field is set on the server (field = 'modified') and at rendering
// it is shown with a green corner, for it's class will be set when the 'modified' field is value
// '1'

// in the column model (excerpt)
        this.colModel = new Ext.grid.ColumnModel({
            columns: [
            // { header: " Id", width: 10, dataIndex: 'us_id'},
            {
                header       : "Schlussel",
                width        : 100,
                dataIndex    : 'se_pkey',
                renderer     : showUpdated
            },{

// showUpdated is checking if field modified in record.data (not a column) has
// been set to '1'. Updated in f.e. PHP and is adding a class over it's meta.css
// to this cell        
        
        function showUpdated (val, meta, record, rowIndex, colIndex, store) {

if (record.data.modified == '1') {
                meta.css += ' y-grid3-updated-cell';
            }
            return val;
        }
        
        
// css styles (custom), the image is a "green" version of the image dirty.gif from the images directory of Extjs (3.2)
// modified with a Photo modification software.

/* updated cells */
   .y-grid3-updated-cell {
      background: transparent no-repeat 0 0;
   }

.y-grid3-updated-cell {
      background-image:url(../img/updated.gif);
   }

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.