how to merge this header columns
i tried to make like this code. but, not working...
(i attached the detail image for understanding)
############## code ####################
$(document).ready(function () {
initGrid();
});
function initGrid(){
var defHeight = '220';
var opt = {
height : defHeight,
showTop : false,
showToolbar : false,
showBottom: false,
showTitle: false,
wrap: false,
editable: false,
title: "", //ParamQuery Grid with Array data
resizable:true,
scrollModel: {autoFit: false},
columnTemplate: { width: 150 },
};
var colArr = getColModel();
opt.colModel = colArr;
opt.mergeCells = [
{ r1:0,c1:11,rc:2,cc:3 },
];
$grid = $("#pqgrid").pqGrid(opt);
gPQGRID = $("#pqgrid").pqGrid( 'instance' );
gPQGRID.refresh();
}
function getColModel(){
var colArr = [
{ title: "User", width: 60, align: "center", dataType: "string"},
{ title: "User Group", width: 100, align: "center", dataType: "string"},
{ title: "User Operation", align: "center",
colModel : [
{title: "User Operation1", align: "center",
colModel:[
{title: "Status", width: 60, align: "center", dataType: "string"},
{title: "User", width: 60, align: "center", dataType: "string"},
{title: "Time", width: 60, align: "center", dataType: "string"},
]
},
{title: "User Operation2", align: "center",
colModel:[
{title: "Status", width: 60, align: "center", dataType: "string"},
{title: "User", width: 60, align: "center", dataType: "string"},
{title: "Time", width: 60, align: "center", dataType: "string"},
]
},
{title: "User Operation3", align: "center",
colModel:[
{title: "Status", width: 60, align: "center", dataType: "string"},
{title: "User", width: 60, align: "center", dataType: "string"},
{title: "Time", width: 60, align: "center", dataType: "string"},
]
}
]
},
{ title: "User Result", align: "center", colModel : [{ title: "User Result", align: "center", colModel:[ {title: "Status", width: 60, align: "center", dataType: "string"}]} ]},
{ title: "User Result", align: "center", colModel : [{ title: "User Result", align: "center", colModel:[ {title: "User", width: 60, align: "center", dataType: "string"}]} ]},
{ title: "User Result", align: "center", colModel : [{ title: "User Result", align: "center", colModel:[ {title: "Time", width: 60, align: "center", dataType: "string"}]} ]}
];
return colArr;
}