CODEWITHSUNDEEP
jqueryjqgrid
bamittal
bamittal

Reputation: 140

jqgrid addRowData gives error t.p.data.push is not a function

I am adding data to the grid using a custom button. In case if data already exists in the grid, the new row is added correctly. But if the grid is empty and i add new row, it gives Uncaught TypeError: t.p.data.push is not a function error at jqgrid source file. Code used to add a new row is as below

var rows = $("#" + gridName).getDataIDs();
$("#" + gridName).jqGrid("addRowData", rows.length + 1, {
Id: rows.length + 1},'first');
$("#" + gridName).editRow(rows.length + 1, true);

I am using a custom nav bar for adding and editing the grid.

The grid is created using the following code createJqGrid:function(gridId, columns, gridData){

        $("#"+gridId).jqGrid({
            datatype: 'local',
            data: gridData,
            editurl: 'clientArray',
            colModel: columns,
            loadonce: false,
            //width: '100%',
            autowidth: true,
            shrinkToFit:false,
            height: 250,
            rownumbers: false,
            multiselect: true,
            cellEdit: true,
            toppager: true,
            cloneToTop: true,
            rowNum: 10000,
            pager: "#pager"+gridId,
            cellsubmit: 'clientArray',
            ondblClickRow: function(rowid, iRow, iCol) {
                //$("#save" + gridId).removeClass("ui-state-disabled");
            },
            beforeSelectRow: function(rowid, e) {
                return true;
            },
            beforeCellSelect: function(rowid, e) {
                return true;
            },
            afterEditCell: function(rowid, cellName, cellValue, iRow, iCol) {

                var cellDOM = this.rows[iRow].cells[iCol];
                $(cellDOM).removeClass("ui-state-highlight");
                $("#save" + gridId).removeClass("ui-state-disabled");

            },
            onCellSelect: function(rowid, celname, value, iRow, iCol) {
                //$("#save" + gridId).removeClass("ui-state-disabled");
             return true;
            },
            loadComplete: function() {

            }

        });

$("#"+gridId).navGrid("#pager"+gridId, {
            cloneToTop: true,
            edit: false,
            search: false,
            add: false,
            del: false,
            refresh: false,
            view: false
        });

After the grid is created, based on some calls, I update the gridData for the grid.

Toolbar is added using

        grid.jqGrid('navButtonAdd', '#' + grid[0].id + '_toppager_left', { // "#list_toppager_left"
            caption: "",
            title: "Add",
            id: 'add' + gridName,
            onClickButton: function() {
                // perform something...
                var rows = $("#" + gridName).getDataIDs();
                $("#" + gridName).jqGrid("addRowData", rows.length + 1, {
                    Id: rows.length + 1
                },'first');

                $("#" + gridName).editRow(rows.length + 1, true);

                // Call this whenever Save button needs to be Enabled
                $("#save" + gridName).removeClass("ui-state-disabled");
            }
        });

when the grid has some data, addRowData works, but when the grid is empty, it gives the error

                if(t.p.datatype === 'local') {
                    lcdata[t.p.localReader.id] = id;
                    t.p._index[id] = t.p.data.length;
                    t.p.data.push(lcdata); // Error comes on this line
                    lcdata = {};
                }

Upvotes: 0

Views: 1608

Answers (2)

Friyank
Friyank

Reputation: 479

I faced the same issue

Error was I was adding data in object format for example array and not in local string So the data type of grid should be Json and not local

This will clear your error

Thank you :)

Upvotes: 0

Oleg
Oleg

Reputation: 221997

You assign data using gridData. Which value have gridData "when the grid is empty"? It should be empty array [] and not undefined or null.

Moreover the filling of grid using var rows = $("#" + gridName).getDataIDs();$("#" + gridName).jqGrid("addRowData", rows.length + 1, {..},'first');... is bad especially if you do this in the loop and fill the grid with many rows. In any way the usage of rows.length + 1 is bad choice if the rows can be deleted and not only inserted. I recommend you to use $.jgrid.randId() function instead which could generate unique value which van be used as rowid.

Upvotes: 1

Related Questions