Question

在ExtJS 4中是否有办法为整个表格中的单元格添加背景颜色，这取决于单元格中的值而不是列上的值？

Answer 1

将渲染器添加到列：

renderer: function (val, metadata, record) {
var backgroundColor = null;
if (val) {
    if (val == 1) backgroundColor = "green";
    if (val == 2) backgroundColor = "red";                   
}
metadata.style = 'background-color: ' + backgroundColor + ';';               
return '';

}

以下是一个工作示例：https://fiddle.sencha.com/fiddle/b73

Answer 2

这对我有用......

renderer : function(value, meta) {
    if(parseInt(value) > 0) {
        meta.style = "background-color:green;";
    } else {
        meta.style = "background-color:red;";
    }
}

Answer 3

基本上你想要做的是：

为所有列创建1个渲染器：

columns:{
  defaults: {
     renderer: myrenderer
    },
   items:[
    //your column definitions here...   
  ]
}

渲染器是这样的：

var myrenderer = function(value, metaData, record, rowIndex, colIndex, store, view) {
if (value >= 0 && value < 25) {
    metaData.tdCls += 'x-change-cell-red';
} else if (value >= 25 && value < 50) {
    metaData.tdCls += 'x-change-cell-orange';
} else if (value >= 50 && value < 75) {
    metaData.tdCls += 'x-change-cell-yellow';
} else if (value >= 75 && value < 100) {
    metaData.tdCls += 'x-change-cell-green';
} else if (value === 100){
    metaData.tdCls +='x-change-cell-awesome-green';
}else {
    metaData.tdCls += 'x-change-cell-violet';
}
return value + '%';
}

ExtJS 4将背景颜色设置为单元格

3 个答案: