jqueryjqgrid

JqGrid reloadGrid keep colapse expand Subgrid


I have a Grid containing a subGrid. Both grids have a Checkbox column. When I click on the parent checkbox it automatically check/uncheck all the subgrid checkboxes. All the checkboxes are mapped with a DB values so each time the status change, it changes the value in the DB and I reload the grids to update the checkboxes status.

The problem is that when I relaod the grids, I loose the expanded subgrid, which is quite annoying since each time I click on a checkbox it reload the grids...

Is there a way to keep the status of which row is expended when reloading the grids?

Here is part of my codes:

$('#jqgSearchTaxPayer').jqGrid({
                        ....
                        subGrid: true,
                        subGridRowExpanded: function (sendSubGrid, lineId) {
                            var sendSubGridId;
                            sendSubGridId = sendSubGrid + "_t";
                            $("#" + sendSubGrid).html("<table id='" + sendSubGridId + "' class='scroll'></table>");

                            $("#" + sendSubGridId).jqGrid({
                                ....

                            { name: 'Keep', index: 'Keep', width: '9px', align: 'center',
                                editable: true, edittype: 'checkbox',
                                formatter: function (cellvalue, options, rowObject) {
                                    cellvalue = cellvalue + "";
                                    cellvalue = cellvalue.toLowerCase();
                                    var bchk = " checked=\"checked\"";
                                    if (cellvalue == "false") {
                                        bchk = "";
                                    }
                                    return "<input type='checkbox' onclick=\"SendLineChecked('" + options.rowId + "','" + sendSubGrid + "');\" " + bchk + " value='" + cellvalue + "' offval='no' />";
                                }, formatoptions: { disabled: false }
                            }],
                                ....

Thanks in advance for your help!


Solution

  • I've found a solution inspired by this post.

    Declare a function which will get all the line that are currently expanded and trigger the reload

    var scrollPosition = 0;
    var ids = [];
    
    function RefreshGridData() {
        var num;
        ids = new Array();
        $("#jqgSearchTaxPayer tr:has(.sgexpanded)").each(function () {
            num = $(this).attr('id');
            ids.push(num);
        });
        $("#jqgSearchTaxPayer").trigger("reloadGrid");
    }
    

    In the GridComplete() function of the main grid, parse the line collection and expand it

    gridComplete: function () {
                                 for (var j = 0; j < ids.length; j = j + 1) {
                                     $("#jqgSearchTaxPayer").jqGrid('expandSubGridRow', ids[j]);
                                 }
                             },