的GridPanel - 基于字段值条件

更改行的颜色比方说，我有一个样品格如下：的GridPanel - 基于字段值条件

+-----------------+-------+-------+--------+ 
| PRODUCT NAME | PRICE | STOCK | STATUS | 
+-----------------+-------+-------+--------+ 
| PRODUCT A  | 10 | 15 | 0 | 
+-----------------+-------+-------+--------+ 
| PRODUCT B  | 17 | 12 | 1 | 
+-----------------+-------+-------+--------+

我想要做的，不断变化的基础上，场STATUS网格行的颜色是什么。如果字段状态等于1那么行颜色应该不同。

型号

Ext.define('Article', { 
extend: 'Ext.data.Model', 
fields: [ 
    {name: 'ID', type: 'int'}, 
    {name: 'ART_NR', type: 'int'}, 
    {name: 'ART_DESC', type: 'string'}, 
    {name: 'SORTEN_TEXT', type: 'auto'}, 
    {name: 'VAR', type: 'int'}, 
    {name: 'GEBI_NR', type: 'int'}, 
    {name: 'SUBSYS_ART_NR', type: 'int'}, 
    {name: 'STATUS', type: 'int'} 
] 
});

的Json商店

var articles = new Ext.data.JsonStore({ 
model: 'Article', 
proxy: { 
    type: 'ajax', 
    url: '<?php echo base_url() ?>create/get_article', 
    reader: { 
     type: 'json', 
     root: 'articleList', 
     idProperty: 'ID' 
    } 
} 
});

网格面板

  { 
      xtype: 'gridpanel', 
      id: 'variant-grid', 
      store: articles, 
      columnLines: true, 
      columns: [ 
       { 
        text: 'TANIM', 
        width: 235, 
        dataIndex: 'SORTEN_TEXT', 
        renderer: function (value, metaData, record) { 
         if (value == null) { 
          return record.get('ART_DESC'); 
         } else { 
          return record.get('SORTEN_TEXT'); 
         } 
        } 
       }, 
       {text: 'VARIANT', dataIndex: 'VAR', width: 90, align: 'center'}, 
       {text: 'GEBI', dataIndex: 'GEBI_NR', width: 90, align: 'center'}, 
       {text: 'SUBSYS', dataIndex: 'SUBSYS_ART_NR', width: 110, align: 'right'}, 
       {text: 'STATUS', dataIndex: 'STATUS', hidden: true} 
      ], 
      style: { 
       fontFamily: 'DINPro-Regular', 
       fontSize: '10pt', 
       marginBottom: '10px' 
      }, 
      height: 180, 
      width: '100%', 
      loadMask: {msg: 'Artikel bilgileri yükleniyor...'}, 
      selModel: selModels 
     }

来源

2013-07-23 Oğuz Çelikdemir

您可以使用getRowClass做到这一点：

在你的网格面板，添加以下内容：

viewConfig: { 
    getRowClass: function(record) { 
     if(record && record.get('STATUS') === 1) return 'different-color-class'; 
    } 
}

http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.view.Table-method-getRowClass

来源

2013-07-23 07:56:42 LUKE

亲爱的卢克，你曾引用'tableview'的xtype，是这样吗？ –

不要因为涉及继承而太多地挂在类型上。我只是给你方法定义的地方。查看网格面板的viewConfig属性。 viewConfig下的第一条评论谈到了getRowClass。在这里看到：http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.panel.Table-cfg-viewConfig – LUKE

谢谢卢克.... –

的GridPanel - 基于字段值条件

回答

相关问题