1.源代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic DataGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/blue/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<div id="dgdataCalibrationPoint" style="width:100%;height:100%"></div>
</body>
</html>
<script>
/* 初始化列表,表头 */
$("#dgdataCalibrationPoint").datagrid({
fit : true,
border : false,
pagination : true,
fitColumns : false,
pageList : [ 10, 50, 100, 150, 200, 250, 300 ],
url : "datagrid_colspan.json",
pageSize : 10,
autoRowHeight : false,
rownumbers : true,
columns : [ [{
field : 'commId',
checkbox : true,
rowspan:2
}, {
field : 'deviceCode',
title : '设备编号',
width : 120,
halign : 'center',
align : 'center',
rowspan:2
}, {
field : 'deviceMn',
title : '设备MN号',
width : 120,
halign : 'center',
align : 'center',
rowspan:2
}, {
field : 'deviceName',
title : '设备名称',
width : 120,
halign : 'center',
align : 'center',
rowspan:2
}, {
field : 'cnName',
title : '计划类型',
width : 100,
halign : 'center',
align : 'center',
rowspan:2
},{
field : 'statusName',
title : '执行状态',
width : 100,
halign : 'center',
align : 'center',
rowspan:2
},{
field : 'xState',
title : ' 湿度校正',
width : 100,
halign : 'center',
align : 'center',
rowspan:2
},
{title:'校准点0',order: 2,colspan:3},
{title:'校准点1',order: 2,colspan:3}],
[{
field : 'xP0RH',
title : '相对湿度(%RH)',
width : 140,
rowspan:1,
halign : 'center',
align : 'center'
},{
field : 'xP0K',
title : '斜率',
width : 100,
rowspan:1,
halign : 'center',
align : 'center'
},{
field : 'xP0B',
title : '截距',
width : 100,
rowspan:1,
halign : 'center',
align : 'center'
},{
field : 'xP1RH',
title : '相对湿度(%RH)',
width : 140,
rowspan:1,
halign : 'center',
align : 'center'
},{
field : 'xP1K',
title : '斜率',
width : 100,
rowspan:1,
halign : 'center',
align : 'center'
},{
field : 'xP1B',
title : '截距',
width : 100,
rowspan:1,
halign : 'center',
align : 'center'
}]],
singleSelect : false,
selectOnCheck : true,
checkOnSelect : true
});
</script>
2.效果