1. #1
    Sencha User
    Join Date
    Dec 2011
    Posts
    6
    Vote Rating
    2
    MakrelJohnson is on a distinguished road

      0  

    Default Unanswered: EXTJS 4.0.7 Grid Row Styles not rendering

    Unanswered: EXTJS 4.0.7 Grid Row Styles not rendering


    Hello, I've been struggling this morning with viewConfig in my Grid Panel setting styles based on cell value.
    The style is being added but the styles are not rendering. ex: yellow background is not displaying, yet you can inspect element and it's built to have a yellow background.

    viewConfig in the grid construction:
    Code:
    viewConfig: {
                getRowClass: function(record, index, rowParams, store) {
                    var cls = '';
                    var data = record.data;
                    if (data.assignedto != '') {
                        cls = 'yellow-row';
                    }
    
    
                    if (data.cancelled != '') {
                        cls = 'red-row';
                    }
                    return cls;
                }
            },
    Row as seen by Chrome. Note the 'yellow-row' class.
    HTML Code:
    <tr class="x-grid-row yellow-row x-grid-row-selected"> ...</tr>
    Am I missing a last command to apply the style? Nothing I've seen in the docs hints to this and I'd appreciate some direction.

    Thanks!
    Last edited by MakrelJohnson; 5 Dec 2011 at 9:17 AM. Reason: ...forgot the 'return cls;' line

  2. #2
    Sencha User
    Join Date
    Dec 2011
    Posts
    6
    Vote Rating
    2
    MakrelJohnson is on a distinguished road

      0  

    Default


    I've used this method, which seems to work for now:
    in my column definitions I added
    Code:
    tdCls: 'x-specialformat-cell'
    on each column.

    I defined a few styles:
    Code:
    .red-row .x-specialformat-cell {background-color: #F5C0C0;}
    .yellow-row .x-specialformat-cell { background-color: #CCCCCC; }
    .green-row .x-specialformat-cell { background-color: #99CC99; }
    I then used my renderer as described above. Seems the tdCls did the trick. By applying it to the entire cell collection, my rows are colored as I need them with select still applying the select class which is fine for me.

    Code:
    ...
    , { header: 'startdate', width: 70, dataIndex: 'startdate', tdCls: 'x-specialformat-cell', renderer: Ext.util.Format.dateRenderer('Y-m-d') }
    ,{ header: 'closeddate', width: 70, dataIndex: 'closeddate', tdCls: 'x-specialformat-cell', renderer: Ext.util.Format.dateRenderer('Y-m-d') }
    , { header: 'status', width: 70, dataIndex: 'status', tdCls: 'x-specialformat-cell' }
    , { header: 'address', dataIndex: 'address', tdCls: 'x-specialformat-cell', flex: 1 }
    , { header: 'city', dataIndex: 'city', tdCls: 'x-specialformat-cell' }
    , { header: 'zip', width: 50, dataIndex: 'zip', tdCls: 'x-specialformat-cell' }
    , { header: 'region', width: 50, dataIndex: '', tdCls: 'x-specialformat-cell' }
    I referenced this page to get this to work: http://jsfiddle.net/molecule/tPB8Z/

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi