CODEWITHSUNDEEP
jqgridfree-jqgrid
arame3333
arame3333

Reputation: 10193

Free JqGrid - grid does not refresh

I have a combo box where when the selection changes, the associated grid is repopulated with new data.

<div class="container-fluid">
        <div class="row">
            <div class="col-md-4">
                <select id="Subcontractors"
                        data-bind="options: Subcontractors, optionsText: 'Subcontractor', optionsValue: 'ContractSubcontractorId', value: selectedSubcontractor, optionsCaption: '<-- Select Subcontractor -->', event:{ change: subcontractorChanged}"
                        class="form-control"></select>
            </div>
        </div>
    </div>
    <div id="containerGrid">
        <div id="divLoading" class="jqgrid-fluid-width divLoading has-error"></div>
        <table id="grid" class="grid"></table>
        <div id="pager"></div>
    </div>

The grid is defined as follows;

var populateGrid = function (data, $form) {
    var grid = $("#grid");
    grid.jqGrid({
        data: data,
        colNames: ["Open Faults", "Address", "Fault No", "Description"],
        colModel: [
            { name: "numberOfOpenFaults", width: 50 },
            { name: "fullAddress", width: 400, align: "left" },
            { name: "faultNo", width: 50 },
            { name: "description", width: 400, align: "left" }
        ],
        prmNames: { id: "contractSubcontractorId" },
        localReader: { id: "contractSubcontractorId" },
        cmTemplate: { autoResizable: true },
        autoresize: true,
        rownumbers: true,
        viewrecords: true,
        iconSet: "fontAwesome",
        autoResizing: { compact: true },
        treeGrid: true,
        treeGridModel: "adjacency",
        ExpandColumn: "numberOfOpenFaults"
    }).jqGrid("gridResize");
    $(".divLoading").hide();
};

var getGrid = function (callback, selectedSubcontractorId) {
    var url = GetHiddenField("sir-get-open-faults-list-url").replace("#", selectedSubcontractorId);
    dataService.getList(url, callback);
};

var reloadGridWithUpdatedData = function (data) {
    var grid = $("#grid");
    var p = grid.jqGrid("getGridParam"); // get reference to all parameters
    p.data = data; // replace data parameter
    grid.trigger("reloadGrid");
};

So when I want to repopulate the grid, the callback function in getGrid is reloadGridWithUpdatedData. Otherwise for the initial population of the grid I use the function populateGrid. The 2 functions are called correctly, but in the function reloadGridWithUpdatedData the line 

var p = grid.jqGrid("getGridParam");

does not appear to be executed. It does not throw an exception either. Is it not finding anything?

UPDATE: When the data is first loaded, the data is divided into the correct columns depending on the name of the field, as you would expect. When the data is reloaded the data columns are in the order that they are in the data structure, ignoring the column names. This I find in the p.data property of the grid. So I made sure that the data structure is reorganised in the same order as the column names, but this does not make any difference, the grid fails to reload. So why is the reload failing to assign the new data to the data columns?

UPDATE2 - Initially the grid is empty. The data is loaded into the grid every time an item in a combo box is selected, so the data layout is the same. Using Fiddler I have captured the data for 2 successive combo selections;

Transfer-Encoding: chunked
Content-Type: application/json; charset=utf-8
Server: Kestrel
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://localhost:12528
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcZ2VvZmZyZXlwYXluZVxEb2N1bWVudHNcVmlzdWFsIFN0dWRpbyAyMDE3XFByb2plY3RzXFNJUlxTSVJcYXBpXGNvbnRyYWN0cmVwb3J0XGdldGdyaWRieXN1YmNvbnRyYWN0b3JcNTg5XDE3?=
X-Powered-By: ASP.NET
Date: Mon, 22 Oct 2018 07:12:09 GMT

400
[{"numberOfOpenFaults":"1","fullAddress":"16, ACACIA ROAD, NORBURY, SW16 5PP","faultNo":"","description":"","id":4472,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"6","description":"General Mechanical - Thermostatic Mixing Valves","id":95,"parent":4472,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"3","fullAddress":"85, ACADEMY GARDENS, ADDISCOMBE, CR0 6QL","faultNo":"","description":"","id":4474,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"1","description":"General Mechanical - Low Temperature Hot Water","id":39,"parent":4474,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"4","description":"Boilers HIU - Ventilation","id":65,"parent":4474,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"9","description":"Gener
400
al Mechanical - Defect(s) Outstanding","id":70,"parent":4474,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"1","fullAddress":"8, ADMIRALS WALK, Tollers Estate COULSDON EAST, CR5 1BR","faultNo":"","description":"","id":4478,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"3","description":"Ventilation - Grilles/air valves","id":105,"parent":4478,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"4","fullAddress":"14, ASHWOOD GARDENS, FIELDWAY, CR0 0SH","faultNo":"","description":"","id":4492,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"4","description":"Certification Mechanical - Boiler Benchmark/Manual","id":79,"parent":4492,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"6","description":"Unvented HWS Cylinder (UHC) - Pipework configuration","i
8c
d":81,"parent":4492,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"7","descrip
374
tion":"Unvented HWS Cylinder (UHC) - Pipework configuration","id":86,"parent":4492,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"8","description":"General Mechanical - Dry Risers","id":87,"parent":4492,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"2","fullAddress":"31, ASHWOOD GARDENS, FIELDWAY, CR0 0SH","faultNo":"","description":"","id":4498,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"1","description":"General Mechanical - Waste","id":82,"parent":4498,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"2","description":"General Mechanical - Thermostatic Mixing Valves","id":83,"parent":4498,"level":1,"isLeaf":true,"expanded":false,"loaded":true}
1
]
0

HTTP/1.1 200 OK
Transfer-Encoding: chunked
Content-Type: application/json; charset=utf-8
Server: Kestrel
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://localhost:12528
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcZ2VvZmZyZXlwYXluZVxEb2N1bWVudHNcVmlzdWFsIFN0dWRpbyAyMDE3XFByb2plY3RzXFNJUlxTSVJcYXBpXGNvbnRyYWN0cmVwb3J0XGdldGdyaWRieXN1YmNvbnRyYWN0b3JcNTg5XDE5?=
X-Powered-By: ASP.NET
Date: Mon, 22 Oct 2018 07:13:57 GMT

400
[{"numberOfOpenFaults":"2","fullAddress":"16, ACACIA ROAD, NORBURY, SW16 5PP","faultNo":"","description":"","id":4471,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"23","description":"Accessories - Existing not replaced/removed","id":106,"parent":4471,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"25","description":"Lighting - Emergency Lighting","id":123,"parent":4471,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"1","fullAddress":"85, ACADEMY GARDENS, ADDISCOMBE, CR0 6QL","faultNo":"","description":"","id":4473,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"4","description":"Alarms - Location","id":85,"parent":4473,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"1","fullAddress":"137, ACADEMY GARDENS, ADDISCOMBE, CR0 6QN","faultNo":"","des
400
cription":"","id":4475,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"6","description":"Alarms - Location","id":110,"parent":4475,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"1","fullAddress":"18, CHERTSEY CRESCENT, NEW ADDINGTON, CR0 0DA","faultNo":"","description":"","id":4573,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"2","description":"Earthing and Bonding - Supplementary bonding","id":137,"parent":4573,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"2","fullAddress":"Plot 2, 29, The Street, Geoff Close, , N1 7PL","faultNo":"","description":"","id":8705,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"1","description":"Lighting - Type","id":170,"parent":8705,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberO
310
fOpenFaults":"","fullAddress":"","faultNo":"2","description":"Certification Electrical - Fire Alarm Certificate","id":171,"parent":8705,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"2","fullAddress":"Wenlock Barn Estate Hoxton Hackney, N1 7PL","faultNo":"","description":"","id":8899,"parent":0,"level":0,"isLeaf":false,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"1","description":"Accessories - Type/quantity/setting-out","id":179,"parent":8899,"level":1,"isLeaf":true,"expanded":false,"loaded":true},{"numberOfOpenFaults":"","fullAddress":"","faultNo":"2","description":"General Electrical - Incorrect circuit protective device","id":180,"parent":8899,"level":1,"isLeaf":true,"expanded":false,"loaded":true}]
0

Upvotes: 2

Views: 260

Answers (2)

Oleg
Oleg

Reputation: 221997

First of all the data, which you use have small, but important problem. One have to replace 

"parent": 0

property in all root elements of the grid to

"parent": null

It fixes the problem with sorting in the TreeGrid. See the old answer for more details.

To understand the problem with reloading of TreeGrid data one need to look in the following lines of free jqGrid code:

// fix to allow to load TreeGrid using datatype:"local", data:mydata instead of treeGrid: true
if (p.treeGrid && p.datatype === "local" && p.data != null && p.data.length > 0) {
    p.datatype = "jsonstring";
    p.datastr = p.data;
    p.data = [];
}

populate.call(ts);

see here. It means that the code of free jqGrid allows to use datatype: "local" and data parameter as input to simplify the usage of TreeGrid, but it uses still the old jqGrid method for loading TreeGrid data.

Because of that reloading of TreeGrid data will be a little other, for example the following:

var reloadGridWithUpdatedData = function (data) {
    var grid = $("#grid"),
        p = grid.jqGrid("getGridParam");

    p.data = [];
    p.datatype = "jsonstring";
    p.datastr = data;

    grid[0].grid.populate.call(grid[0]);
};

See the corresponding demo here: https://jsfiddle.net/OlegKi/o1bhpLyu/

Upvotes: 1

coderboy_4200
coderboy_4200

Reputation: 53

var reloadGridWithUpdatedData = function (data) {
    var grid = $("#grid");
    grid.clearGridData();
    grid.jqGrid('setGridParam', {data:data)});
    grid.trigger("reloadGrid");
};

I have made some modification to your existing code. Please retry with the updated code and check.You need to clear the existing data and reset it with setGridParam before reloading the grid.

Upvotes: 0

Related Questions