第一种情况:加载数据时改变列的颜色

首先定义一个样式如下(这里以红色背景为例):

}

 

 

定义改变颜色的列:

        }

效果图如下:
EXTJS GRID 改变单元格背景颜色的方法

第二种情况:加载数据完成后改变行的颜色

首先要解决的一个问题是如果判断数据已经加载完毕,最简单的方法是给grid的store添加onload事件。
如果你想有条件地改变某行的背景颜色,则还需要遍历gird的store,这里有个简单的方法即store的
each方法。看下面这个例子:

);

效果图如下:
EXTJS GRID 改变单元格背景颜色的方法

第三种情况:使用Ext本身的颜色渲染效果


暂时只发现Ext已经设计好的一种效果:单双行背景颜色不同。
很简单,在grid中配置stripeRows为true即可! 

另外,如果想使用自己定义的行的背景颜色,那就去修改ext-all.css吧,提供几个:
EXTJS GRID 改变单元格背景颜色的方法-----------在ext-all.css修改代码如下---------
EXTJS GRID 改变单元格背景颜色的方法

 

 //修改GRID某一行样式 grid.getView().addRowClass(r,css)

//修改grid某一单元格样式 Ext.get(grid.getView().getCell(r,c)).addClass(css) 或 grid.getView().getRow(r).style.backgroundColor="red"; //css样式为自定义样式

 

 

相关文章: