how to add new row in jqgrid in middle of grid

Question

jqGrid 4.3 allows to add new row using inline edit.

Inline navigator demo in http://trirand.com/blog/jqgrid/jqgrid.html Shows that after add command grid is scrolled to top and added row appears in top of grid. This is confusing.

How to force added row to appear before current row?

I posted this as feature request in http://www.trirand.com/blog/?page_id=393/feature-request/force-added-row-in-inline-edit-to-appear-before-current-row/

Oleg Oleg · Accepted Answer · 2011-12-15T10:22:15

In the answer I suggested to extend addRowData method to support new 'afterSelected' and 'beforeSelected' values (additionally to existing 'first', 'last', 'before' and 'after') of the position parameter. I shown one can overwrite (subclass) the original addRowData method to add the support without writing the full code of addRowData.

In the corresponding demo I demonstrated how one could use the feature in case of the usage of form editing.

In the same way we can solve the problem in the inlineNav method too. The new demo demonstrate this.

The corresponding code is practically the copy of the codes from the answer.

var oldAddRowData = $.fn.jqGrid.addRowData;

$.jgrid.extend({
    addRowData: function (rowid, rdata, pos, src) {
        if (pos === 'afterSelected' || pos === 'beforeSelected') {
            if (typeof src === 'undefined' && this[0].p.selrow !== null) {
                src = this[0].p.selrow;
                pos = (pos === "afterSelected") ? 'after' : 'before';
            } else {
                pos = (pos === "afterSelected") ? 'last' : 'first';
            }
        }
        return oldAddRowData.call(this, rowid, rdata, pos, src);
    }
});

...
$("#list").jqGrid('inlineNav', '#pager', {addParams: {position: "afterSelected"}});

Probably I should post to trirand the corresponding suggestion to modify the original addRowData method with the described above features.

how to add new row in jqgrid in middle of grid

1 Answers