easylui datagrid 动态生成列
Posted 芜明-追星
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easylui datagrid 动态生成列相关的知识,希望对你有一定的参考价值。
function load(sdate) {
$.getJSON("workorder/statistics.do", {
sdate : sdate+‘-01‘
}, function(resp) { //获取数据源
var columns = new Array(); //定义列集合
var row = resp.rows[0]; //获取首行数据
//根据首行数据创建columns配置
$.each(row, function(i, v) {
if (i != "username") {
var column = {};
column["title"] = "" + i;//我这里默认用键值做title,一般可以根据键值自定义
column["width"] = 25;
column["field"] = "" + i;//数据的键值就是field
column["align"] = "center";
column["styler"] = function(value) {
var d = new Date(sdate+‘-‘ + i);
if (d.getDay() == 6 || d.getDay() == 0) {
return "background:#DDD";
}
if (value == 1) {
return "background:#CCFF33";
}
};
column["formatter"] = function(value) {
return " ";
};
columns.push(column);//放入定义数组
}
});
//实例化一个datagrid
$(‘#statistics‘).datagrid({
toolbar : "#searchBar",
rownumbers : true,
singleSelect : true,
fit : true,
striped: true,
onSelect : function(rowIndex) {
$(this).datagrid("unselectRow", rowIndex);
},
frozenColumns : [ [ {
title : ‘姓名‘,
field : ‘username‘,
width : 60,
align : "center"
} ] ],
columns : [ [ {
colspan : columns.length,
title : "<b>"+sdate+"月 部门人员任务分配情况</b>"
} ], columns ]
}).datagrid("loadData", resp.rows);//实例化之后立刻载入数据源
});
}
以上是关于easylui datagrid 动态生成列的主要内容,如果未能解决你的问题,请参考以下文章