私はjqgrid 4.4.5を使用しています
私はこのようなグリッド構成を持っています:
$(document).ready(function () {
$('#listROvertime')
.jqGrid({
//url: 'http://localhost/bison/rovertime/listing',
datatype: 'json',
mtype: 'post',
colNames: ["NIK","Nama","Divisi","Jam","Tarif","Total"],
colModel: [
{name:"rovertime_nik",index:"rovertime_nik",width:100,
frozen:true,
key:true,
searchoptions:{
sopt:["eq","ne","bw","bn","ew","en","cn","nc"]
}
},
{name:"rovertime_name",index:"rovertime_name",width:260,
frozen:true,
searchoptions:{
sopt:["eq","ne","bw","bn","ew","en","cn","nc"]
}
},
{name:"rovertime_div",index:"rovertime_div",width:120,
frozen:true,
search:false
},
{name:"rovertime_ocount",index:"rovertime_ocount",width:70,align:"right",
formatter:"currency",
formatoptions:{thousandsSeparator:","},
search:false,
sortable:false
},
{name:"rovertime_oprice",index:"rovertime_oprice",width:110,align:"right",
formatter:"currency",
formatoptions:{thousandsSeparator:","},
search:false,
sortable:false
},
{name:"rovertime_over",index:"rovertime_over",width:110,align:"right",
formatter:"currency",
formatoptions:{thousandsSeparator:","},
search:false,
sortable:false
}
],
autowidth: true,
caption: 'Laporan Lembur'
}).jqGrid('setGroupHeaders', {
useColSpanStyle: true,
groupHeaders: [
{startColumnName: 'rovertime_ocount', numberOfColumns: 3, titleText: '<center>Lembur</center>'}
]
}).jqGrid('setFrozenColumns');
});
私が期待した結果の列構造は、「NIK、Nama、Divisi、Jam、Tarif、Total、Lain - Lain、Insentif、Total、Potongan Lain - Lain、Total」です。colModel ID「rovertime_div」でfrozenオプションをfalseに設定すると、列構造が正しく表示されます。そうしないと、frozen オプションを true に設定すると、列構造が正しく表示されません。
これは、期待される結果がどのように見えるかを示しています。
UPDATE 1 : useColSpanStyle: false を列構造に設定すると、正しく表示されます。