1

我想根据 cfgrid 中的状态条件更改单元格的颜色。

例如：

  1. 如果记录的状态为过期，则单元格将变为红色，过期为粗体。
  2. 如果记录状态为到期（30 天内），则单元格将变为黄色，到期以粗体显示。
  3. 如果记录的状态为当前（到期日期超过 30 天），则单元格将为绿色，当前为粗体...。

我只能找到 cfgridrow 和 cfgridcolumn 的渲染。

4

2 回答 2

3

您应该求助于 ExtJS 提供的列渲染器属性。列的渲染器获取三个参数，第二个是元对象，您可以在其上设置一个名为 attr 的属性，该属性被设置为单元格 dom 元素的属性。您可以为单元格提供一些 CSS 样式，例如：

var renderer = function(value, meta, record){
    if(value == "Overdue") { meta.attr = 'style="color:red;font-weight:bold"'; }
    if(value == "Due") { meta.attr = 'style="color:yellow;font-weight:bold"'; }
    if(value == "Current") { meta.attr = 'style="color:green"'; }
    return value;
}

检查Ext.grid.ColumnModel 文档中的 setRenderer

于 2011-03-01T21:24:11.377 回答
0

我使用类似于您需要网格中的列来显示到期日期的东西：

{
 header:    'Expiration Date',    
 dataIndex: 'ExpireDate',
 renderer:  function (value, metaData, record, rowIndex, colIndex, store) {

     if ( record.get ( 'ExpireDate' ) < new Date ( ).clearTime ( ) ) {
       metaData.css += ' y-grid3-expired-cell';
       value = '';    
     }
     if ( record.get ( 'ExpireDate' ).format ('m/d/Y') == '12/31/9999' ) {
       metaData.css += ' y-grid3-non-expired-cell';
       value = '';
     }        
     value = (value == '') ? '' : record.get ('ExpireDate').format ('m/d/Y');
   }      
   return value;    
 }

},

使用 css 类是更强大的解决方案，我的类定义如下：

.y-grid3-expired-cell {
  background:         #AA0000;
} 

.y-grid3-non-expired-cell {
 background:         #00AA00;
}

只有你需要做的就是添加你自己的逻辑和样式......

于 2011-03-02T03:11:53.797 回答