日期:2014-05-16  浏览次数:20436 次

EXTJS中Ext.grid.Panel根据行号设置颜色
getRowClass : function(record,rowIndex,rowParams,store){}
方法里面可以return 样式名称 即可改变该行颜色

但是我遇到一个问题
现在需要根据行号rowIndex来设置那一行的颜色
请问怎么办??
多谢

------解决方案--------------------
css样式,这个是改背景颜色的:

.child-row .x-grid-cell { background-color: #F08080; color: #000000; }
.adult-row .x-grid-cell { background-color: #ffffff; color: #000000; }


Ext grid配置,这里是按奇数和偶数行来设置颜色的,因为你没说清楚你要怎么设置:

viewConfig : {
getRowClass :( record, rowIndex, rowParams, store ){
return rowIndex % 2 == 0 ? 'child-row ': 'adult-row';
}
}


ExtJS API about the function getRowClass:
http://docs.sencha.com/extjs/4.0.7/#!/api/Ext.view.Table-method-getRowClass

下面是.x-grid-cell的所有配置项,你可以自己改:


x-grid-cell{color:null;font:normal 11px tahoma, arial, verdana, sans-serif;background-color:white;border-color:#ededed;border-style:solid;border-width:1px 0;border-top-color:#fafafa}

------解决方案--------------------
引用
有没有一个类似
getRow(rowIndex).setCss
或者
getRow(rowIndex).setColor
来设置颜色呢?
因为我在getRowClass里面不能及时确定我要的颜色
用return样式名来做的话,我需要等待一个同步请求
我的单页面显示25条记录,这样就要等25次
会卡3,4秒

你的意思是行的颜色是由后台一次性传过来确定的对吧,有两种方法可以解决1是把颜色值放入store的一个字段中,因为其实数据定了颜色也就定了,这样就可以同步处理了,你的列模型中不用这个颜色字段就行了,这比较简单。2。在任然按你的做,在颜色值ajax传过来success中刷新view,让grid重新渲染取出颜色值设置css。