CODEWITHSUNDEEP
jqgrid
Higher-Kinded Type
Higher-Kinded Type

Reputation: 2054

jqGrid: Not loading when pager set and array data used, why?

I am using array data to load a jqGrid with support for pagination. Without the pager property set, the grid loads the data, and looks like this:

enter image description here

The blue bar at the bottom is the pager element. But if the pager property is set, I am getting the following error:

Uncaught TypeError: Cannot read property 'integer' of undefined jquery.jqGrid.min.js:131
> a.updatepager jquery.jqGrid.min.js:131
> U jquery.jqGrid.min.js:67
> M jquery.jqGrid.min.js:81
> (anonymous function) jquery.jqGrid.min.js:135
> jQuery.extend.each jquery-1.10.2.min.js:657
> jQuery.fn.jQuery.each jquery-1.10.2.min.js:266
> b.fn.jqGrid jquery.jqGrid.min.js:33
> createGrid

Please help me find what I am doing wrong.

HTML:

<div>
    <table id=grid></table>
    <div id=grid_pager></div>
</div>

JS

function createGrid(dataAsArray) {
    $('#grid').jqGrid({
        caption: caption,
        colModel: getColumnModel(),

        scrollOffset: 0,
        hidegrid: true,
        sortorder: 'desc',
        recreateForm: true,
        height: '100%',

        pager: '#grid_pager'
        rowNum: 10,
        rowList: [5, 10, 20, 40, 80],
        viewrecords: true,
        multiselect: true,

        datatype: 'local',
        data: dataAsArray,
        localReader: {
            repeatitems: true,
            cell: '',
            id: 0
        }
    }); 

    $('#grid').jqGrid('navGrid', { edit: true, add: false, del: false, position: 'left' });

    .jqGrid('setGridParam', {
        rowNum: 5,
        rowList: [5, 10, 20, 30, 100, 500]
    }).trigger('reloadGrid');
}

ARRAY DATA

[
    [ 246802, 'ab', 2, 'Invalid amount' ],
    [ '', 12, 3, 'Invalid account' ],
    ...
]

Your help is highly appreciated!

Thanks Vivek Ragunathan

Upvotes: 1

Views: 2570

Answers (2)

Oleg
Oleg

Reputation: 221997

Such error occurs typically if one forget to include grid.locale-en.js (or some other file from i18n directory). The file is really required for jqGrid. You should include it before jquery.jqGrid.min.js (or alternatively jquery.jqGrid.src.js). If you forgot to include grid.locale-en.js then the line 

fmt = $.jgrid.formatter.integer || {};

will produce the error which you described because $.jgrid.formatter stay undefined (it will be defined in the line) and the expression $.jgrid.formatter.integer will generate the error.

Upvotes: 5

Tomcat
Tomcat

Reputation: 36

Try this

pager: $('#grid_pager'),

Hope it helps.

Upvotes: 0

Related Questions