论坛首页 Web前端技术论坛

Ext.grid:自定义函数,查询结果根据不同的结果显示不同的颜色

浏览 1960 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-12-28   最后修改:2009-12-28
  有时候根据查询出来的结果,比如年龄,或年假天数,变态的用户要求根据不同的数值显示不同的颜色,比如:年龄>30 是红色,年龄<30 显示绿色

  自定义函数 render 来实现
  部门代码如下:
   //根据条件用来转换年龄的字体颜色
    function pctChange(val){
        if(val <=30){
            return '<span style="color:green;">' + val + '</span>';
        }else if(val > 30){
            return '<span style="color:red;">' + val + '</span>';
        }
        return val;
    }

	var cm = new Ext.grid.ColumnModel([
			new Ext.grid.RowNumberer({header : '',width : 30,}),
			{header:'员工姓名',dataIndex:'empName',sortable:false,width:230},
			{header:'职位名称',dataIndex:'positionName',sortable:false,width:240},
			{header:'职位分类',dataIndex:'positionClassName',sortable:false,width:230},
			{header:'职位说明书',dataIndex:'positionClassNumber',sortable:false,width:180},
			{header:'年龄',dataIndex:'age',sortable:false,width:70,renderer:pctChange,//设置年龄显示的颜色
}	]);

 
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics