javascriptjqueryjqgridjqgrid-formatter

JQgrid FreezeColumn not freezing headers?

I am new to JQgrid and have been attempting to freeze the first column in the grid so horizontal scrolling will not effect that column.

I have frozen: true in the colModel, as well as calling Jquery("#grid").jqGrid('setFrozenColumns');.

This correctly freezes the column DATA, but as I scroll to the right, the column headers scroll with me. How can I freeze the headers too?

Thank you very much!

Sample Code: 

jQuery("#taskGrid").jqGrid({
datatype: "jsonstring",
colNames:['task ID','TASK Name', 'ROLE Info'],
colModel:[
    {name:'taskId',index:'taskId', width:100, frozen: true},
    {name:'taskName',index:'taskName', width:200},
    {name: 'roleInfo.1', index: 'roleInfo.1', width:100, formatter: 'checkbox' }

],
jsonReader: {repeatitems: false},
datastr: JSON.parse(document.form.taskData.value),
rowNum:50,
pager: '#pager2',
sortname: 'taskId',
viewrecords: true,
sortorder: "desc",
caption:"JSON Example",
height: "750", 
width: "350",
shrinkToFit: false
});jQuery("#taskGrid").jqGrid('setFrozenColumns');
Solution

  • Try to use free jqGrid 4.13.4 instead of Guriddo jqGrid JS 5.1.0, which you use currently. First of all it includes many fixes in frozen columns, contains many enhancements and its free in opposite to Guriddo jqGrid JS (see the prices here). To try free jqGrid you can just use load all jqGrid directly from CDN (see the wiki article).

    I'd recommend you additionally to use datatype: "local" and data: jQuery.parseJSON(document.form.taskData.value) instead of datatype: "jsonstring" and datastr. The datatype "jsonstring" is good only if you need to prevent local sorting of input data during initial loading. If you would use datatype: "local" then the input data will be sorted locally based on sortname: 'taskId' and sortorder: "desc" before there will be displayed.