Чтобы изменить цвет фона всей строки, мы можем использовать getRowClass, но как сделать одну и ту же логику только для одной ячейки и конкретного столбца.... любые идеи?
//EXTJS
viewConfig: {
getRowClass: function(record, index) {
var c = record.get('change');
if (c < 0) {
return 'price-fall';
} else if (c > 0) {
return 'price-rise';
}
}
}
//CSS
.price-fall {
background-color: #FFB0C4;
}
.price-rise {
background-color: #B0FFC5;
}
EDIT:
Существует способ сделать это с помощью
function change(val){
if(val > 0){
return '<div class="x-grid3-cell-inner" style="background-color:#B0FFC5;"><span style="color:green;">' + val + '</span></div>';
}else if(val < 0){
return '<div class="x-grid3-cell-inner" style="background-color:#FFB0C4;"><span style="color:red;">' + val + '</span></div>';
}
return val || 0;
}
а затем просто:
...
{header: 'Change', width: 75, sortable: true, renderer: change, dataIndex: 'change', align: 'center'}
...
но в этом случае сетка деформируется при изменениях от белого до цветного фона...???
любые другие идеи?
ИЗМЕНИТЬ
После того, как пользовательский css будет применен к столбцу, как удалить его за короткий промежуток времени, значит, он будет мигать один раз, когда значение изменилось? Что-то вроде setTimeout("remove-css()",1000);
или с Ext.Function.defer(remove-css, 1000);
Любые идеи?