ExtJS——单元格背景色隐藏脏标志

Question

我有一个可编辑的网格。编辑列时，我显示脏标志并更改单元格背景颜色。为此，我更新了 CSS class:

.x-grid-dirty-cell {
    background-image: url(../images/grid/dirty.gif) no-repeat 0 0 !important;
    background-color:#ffff4d !important;
}

这很好用。但是，当我更改整行的背景颜色时，脏标志不再显示：

,viewConfig: {
    getRowClass: function(record_){
      if(record_.COPIED){
        return "row-highlight";
      } 
    }
  }

CSS:

.row-highlight .x-grid-cell{
    background-color:#ffff4d !important;        
}

那么我需要将哪些属性添加到行突出显示 class 以便不隐藏脏标志？

谢谢

Answer 1

几件事

1 - background-image: url(../images/grid/dirty.gif) no-repeat 0 0 !important; 不是有效语法，您将其与 background 属性.

混淆了

2 - 不要将 !important 添加到 .row-highlight .x-grid-cell 这将使限制较少的选择器无法替换单元格背景颜色。

你的CSS应该看起来像

.row-highlight .x-grid-cell {
    background-color: #ffff4d;
}
.x-grid-dirty-cell {
    background: url(../images/grid/dirty.gif) no-repeat left center !important;
}

检查此 fiddle：https://fiddle.sencha.com/#fiddle/1251 编辑名称 "Bart" 以查看脏标记 CSS

ExtJS——单元格背景色隐藏脏标志

ExtJS -- cell background color hides dirty flag

html

css

extjs

extjs4.2