Question

I want to centralize the options for my jqgrids into one javascript file that all my grids can use. Such as if its sortable, height, width and the methods such as onSelectRow and loadComplete. I then want to load the options which are specific to that grid such as colModel, caption and sort order in a different javascript file for example

GridMain.js

datatype: 'local',
height: 'auto',
width: 'auto',
pager: $('#pager'),
rowNum: 10,
rowList: [5, 10, 20, 50],
sortorder: "asc",
viewrecords: true,
sortable: true,
onSelectRow: function (id) {
    //redirect to brand details page
    document.location.href = url + id;
}

UserGrid.js

colModel: [
            { name: 'Id', index: 'Id', hidden: true, key: true },
            { name: 'Name', index: 'Name', width: 250, align: 'left' },
            { name: 'Disabled', index: 'Deleted', width: 100, align: 'left' },
            { name: 'Actions', index: 'Actions', width: 150, align: 'center', sortable: false, title: false}],
    sortname: 'Name',
    caption: "Users"
});

I have tried many different ways and i cant seem to figure it out. I tried using the setGridParam method but height, width, colModel cant be changed after the grid is created.

I am using tableToGrid(‘.table-to-grid’, { options }); to initialize my grid

Any help would be appreciated. Thanks

Answer 1

You can include in the GridMain.js the code like

$.extend($.jgrid.defaults, {
    datatype: 'local',
    viewrecords: true,
    height: 'auto',
    ...
});

(see here for more information).

You can also confider to defining column templates (see here).

I don’t recommend you to use tableToGrid and better create jqGrid directly.