jqgrid frozenColumns + (cell Edit & sortable/reordering of non frozen columns)

Question

Please guide me on a work around for having a set of columns frozen and the rest having cell edit feature along with column reordering/ show- hide options using jqgrid.

Thank You.

Answer 1

Please try this, simple solution,

Hide or remove cellEdit: true

Then add the below lines in above and below the setFrozenColumns

Previous code:

 $("#jqGrid2").jqGrid('setFrozenColumns');

New Code:

$("#jqGrid2").jqGrid("setGridParam", {cellEdit: false, sortable: false});
$("#jqGrid2").jqGrid('setFrozenColumns');
$("#jqGrid2").jqGrid("setGridParam", {cellEdit: true, sortable: true});

Answer 2

The problem is that the current implementation of setFrozenColumns have some restrictions. Editing (in any editing mode) and sortable: true is not allowed for frozen columns, but setFrozenColumns. Moreover sortable: true should don't allow to resort headers of frozen columns. On the other side setFrozenColumns contains simple test of some parameters (see here) and the method do nothing if some such parameters (like cellEdit or sortable) are set.

I suggested in the post (with the demo) the way how to implement a workaround. The way is modification of approach from the answer and this one.

I find your question interesting and so I created the demo which demonstrates how one do can implement your requirements. It displays the following results (animated gif):

It uses mostly the following code

// create the grid
$grid.jqGrid({
    ...
});

$grid.bind("jqGridLoadComplete jqGridInlineEditRow jqGridAfterEditCell jqGridAfterRestoreCell jqGridInlineAfterRestoreRow jqGridAfterSaveCell jqGridInlineAfterSaveRow", function () {
    fixPositionsOfFrozenDivs.call(this);
});

$grid.jqGrid("setGridParam", {cellEdit: false, sortable: false});
$grid.jqGrid("setFrozenColumns");
$grid.jqGrid("setGridParam", {cellEdit: true, sortable: true});
fixPositionsOfFrozenDivs.call($grid[0]);

try {
    var p = $grid.jqGrid("getGridParam"), tid = $.jgrid.jqID(p.id), colModel = p.colModel, i, n = colModel.length, cm,
        skipIds = [];

    for (i = 0; i < n; i++) {
        cm = colModel[i];
        if ($.inArray(cm.name, ["cb", "rn", "subgrid"]) >=0 || cm.frozen) {
            skipIds.push("#jqgh_" + tid + "_" + $.jgrid.jqID(cm.name));
        }
    }

    $grid.jqGrid("setGridParam", {sortable: {options: {
        items: skipIds.length > 0 ? ">th:not(:has(" + skipIds.join(",") + "),:hidden)" : ">th:not(:hidden)"
    }}});

    $grid.jqGrid("sortableColumns", $($grid[0].grid.hDiv).find(".ui-jqgrid-labels"));
} catch (e) {}