先说下思路,主要通过获取后台返回的数据集,进行循环遍历,设置表格每一行(即一个tr的颜色来实现此效果)。其实通过这种方法,你可以对表格的每一行tr进行任意操作。以下面代码为例:
//加载列表
var option = {
loadComplete: function (resultData) {
setTimeout(function () {
//当表格加载完后,执行该操作方法。
changeRowColor('放表格的div的id', resultData.rows);
//id即为var table = new Grid("id", data, colModel, option);里的 id
}, 300);
},
height: 450,
sortable:true,
multiselect:true
}
其中,resultData来自于ajaxWithProgress方法里的参数,ajaxWithProgress(‘GET’, url, }, function(resultData){})里的这个resultData,也是在function(resultData)方法内部,做表头表格的初始化和每行数据的对应。
function changeRowColor( gridId, gridData ) {
for (var i = 0; i < gridData.length; i++) {
var $tr = $('tr#' + gridData[i].id);
//判断条件
if (?){
$tr.css("color", "red");
} else if(?){
$tr.css("color", "green");
}else {
$tr.css("color", "grey");
}
}
}
最为关键的就是结果集resultData的获取,然后循环js或者jquery操作tr对象。