使用Extjs EXTjs ViewConfig rowclass

我一直在寻找从网格中的一行更改我的background-color。到目前为止，我只有一次改变一种颜色。使用Extjs EXTjs ViewConfig rowclass

这里是我的ViewConf

viewConfig: { 
     getRowClass: function (record, index) { 
      switch (record.get('status')){ 
       case 'load': return 'blue-row';break; 
       case 'miss': return 'blue-row';break; 
       case 'Active': return 'green-row';break; 
       default: return 'white-row'; break; 
      } 
     } 
    }

在我的CSS文件

我：

.green-row .x-grid-cell { 
background-color: #43CE45 ; 
} 
.white-row .x-grid-cell { 
background-color: #FFFFFF ; 
} 
.blue-row .x-grid-cell { 
background: #C4C4C4; 
}

在CSS列表恰在第一次是画，其他的被忽略。在这种情况下，只有绿色的行被涂成绿色，其他的，虽然他们有班级分配，但他们没有被绘。如果我改变顺序，只是拳头是在网格中绘制的。

如何为网格行设置多种颜色？我看到的所有例子都只使用了2种颜色的主要和默认。

在此先感谢！

来源

2017-03-07 Giancarlo Benítez

确定正在应用的类？没有意义，移动它们会产生变化。而且，这些休息是多余的。 –

是的，我在浏览器控制台样式选项卡上检查它，如果行数据发生更改，它们将被分配并在运行时更改。我还检查了其他部分的覆盖规则，但没有。 –

我建议你发布一个测试用例，因为颜色获得与类相匹配的应用，请参阅：https://fiddle.sencha.com/#view/editor&fiddle/1rl5 –

也许，record.get('status')的验证不在案件miss和Active。
尝试调试程序，并通过执行此检查状态：

viewConfig: { 
     getRowClass: function (record, index) { 

      console.log('status => ' + record.get('status')); 

      switch (record.get('status')){ 
       case 'load': return 'blue-row';break; 
       case 'miss': return 'blue-row';break; 
       case 'Active': return 'green-row';break; 
       default: return 'white-row'; break; 
      } 
     } 
    }

See that fiddle case is working

来源

2017-03-08 00:01:30

OP在评论中表示正在正确应用类。 –

是的，你是对的。我相信这里的问题是状态验证！也许他永远不会'错过'或'活跃' –

我已经使用了'console.log'并检查了在第一次加载中分配的类，并在修改状态列时在运行时更改了该类。总是将类更改为正确的类，但仍然绘制css中的第一个 –

使用Extjs EXTjs ViewConfig rowclass

回答

相关问题