如何在网格中间的jqgrid中添加新行

问题描述

jqGrid 4.3允许使用内联编辑添加新行.

http://trirand.com/blog/jqgrid/jqgrid.html 显示在添加命令网格滚动到顶部并且添加的行出现在网格顶部之后.这很令人困惑.

如何强制添加的行出现在当前行之前?

我将此作为功能请求发布在 http://www.trirand.com/blog/?page_id=393/feature-request/force-added-row-in-inline-edit-to-在当前行中出现

解决方案

在答案中，我建议扩展方法来支持position参数的新的"afterSelected"和"beforeSelected"值(除现有的"first"，"last"，"before"和"after"之外).我展示了一个可以覆盖(子类)原始的addRowData方法来添加支持而无需编写addRowData的完整代码的方法.

在相应的演示中，我演示了如何使用使用表单编辑的功能.. >

以相同的方式，我们可以在 inlineNav 方法. 新演示对此进行了演示.

相应的代码实际上是答案中代码的副本.

 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"}});
 

可能我应该发布 trirand 相应的建议来修改原始方法.

jqGrid 4.3 allows to add new row using inline edit.

Inline navigator demo in http://trirand.com/blog/jqgrid/jqgrid.htmlShows 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/

解决方案

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.

这篇关于如何在网格中间的jqgrid中添加新行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！