`

Ext 修改grid行或者列的背景颜色和字体颜色(来自网络)

ext 
阅读更多

原帖地址:http://hi.baidu.com/zkban/blog/item/8019380f83b345f9aa645770.html
Ext 修改grid行或者列的背景颜色和字体颜色
文章分类:Web前端
修改某一列的背景颜色和字体颜色
css代码

.x-grid-back-red {
    background: #FF0000;   //修改背景颜色
    color:#000000;  //修改字体颜色
}


JS代码

{
header : '分成类型',
dataIndex : 'divideType',
renderer : function(v,m){
  m.css='x-grid-back-red';
                return v;
},
width : 60
}


或者直接这样

{
header : '编号',
dataIndex : 'fcId',
css : 'background: #FF0000;color:#000000',
width : 40
}


修改某一行的背景颜色和字体颜色
css代码

.x-grid-record-red {
    background: #FF0000;   //修改背景颜色
    color:#000000;  //修改字体颜色
}


JS代码
直接在grid中设置viewConfig属性

viewConfig : {
forceFit :true,
getRowClass : function(record,rowIndex,rowParams,store){
  //禁用数据显示红色
  if(record.data.limitType=='1' && record.data.isLeaf=='N'){
   return 'x-grid-record-red';
  }else{
   return '';
  }
}
}


或者为grid添加load方法

grid.getStore().on('load',function(s,records){
          var girdcount=0;
          s.each(function(r){
              if(r.get('10')=='数据错误'){
                    grid.getView().getRow(girdcount).style.backgroundColor='#F7FE2E';
              }
              girdcount=girdcount+1;
          });
});
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics