1

我正在对本地数据使用表单编辑。我能够编辑表单中的值并将值设置回行（使用 setRowData）。但是当我来回翻页时，更改会丢失。

如何保存对行和网格中基础源的更改？稍后我必须迭代行，验证所有错误都已更正（使用编辑表单），并将其发布到服务器。

代码：

var gridId = 'mygrid';
var pagerId = 'mygridpager';

var grid = $('#mygrid');
var pager = $('#mygridpager');

grid.jqGrid({
    caption: caption,
    colModel: getColModel(),
    recreateForm: true,

    hidegrid: true,
    sortorder: 'desc',
    viewrecords: true,
    multiselect: true,
    rownumbers: true,

    autowidth: true,
    height: '100%',
    scrollOffset: 0,

    datatype: 'local',
    data: dataAsArray,
    localReader: {
        repeatitems: true,
        cell: '',
        id: 2
    },

    pager: '#' + pagerId,
    pgbuttons: true,
    rowNum: 5,
    rowList: [2, 5, 7, 10, 250, 500]
});

grid.jqGrid('navGrid',
    '#' + pagerId,
    {
        add: false,
        del: false,
        search: false,

        edit: true,
        edittext: 'Fix Error',
        editicon: 'ui-icon-tag',
        editurl: 'clientArray',

        refreshtext: 'Refresh',
        recreateForm: true
    },
    {
        // edit options
        editCaption: 'Fix Error',
        editurl: 'clientArray',
        recreateForm: true,
        beforeShowForm: function(form) {
            /* Custom style for elements. make it disabled etc */
        },
        onclickSubmit: function(options, postdata) {
                    var idName= $(this).jqGrid('getGridParam').prmNames.id;

                    // [UPDATED]
                    if (postdata[idName] === undefined) {
                        var idInPostdata = this.id + "_id";
                        postdata[idName] = postdata[idInPostdata];
                        postdata['row'] = postdata[idInPostdata];
                    }

            $('#mygrid').jqGrid('setRowData', postdata.row, postdata);

            if (options.closeAfterEdit) {
                $.jgrid.hideModal('#editmod' + gridId, {
                    gb: '#gbox_' + gridId,
                    jqm: options.jqModal,
                    onClose: options.onClose
                });
            }

            options.processing = true;

            return {};
        }
    },
    {}, // add options
    {}, // del options
    {} //search options
).trigger('reloadGrid');

感谢您的帮助。

谢谢

4

1 回答 1

1

我想你的问题的原因是输入数据的数组格式（ repeatitems: truein ）的使用。localReader我想您需要从构建数组postdata并将其用作参数setRowData而不是postdata.

如果建议对您没有帮助，您应该使用测试数据发布更完整的网格代码。像这样的代码colModel: getColModel(),并没有真正的帮助。换句话说，您应该发布足够的信息来重现问题。最好的是http://jsfiddle.net/中的工作演示。如果您准备这样的演示，请使用jquery.jqGrid.src.js而不是jquery.jqGrid.min.js.

更新：您的代码中的问题是使用数组是输入的项目data（您使用repeatitems: truein localReader）。在这种情况下，当前实现setRowData不支持（工作不正确）。例如，如果您最初拥有此类数据

在此处输入图像描述

并开始编辑第三行，您将拥有如下内容

在此处输入图像描述

使用后喜欢$('#mygrid').jqGrid('setRowData', postdata.row, postdata);里面的onclickSubmit。所以内部数据会被错误地修改。

setRowData为了解决这个问题，我建议通过包含以下代码来覆盖当前的实现

$.jgrid.extend({
    setRowData : function(rowid, data, cssp) {
        var nm, success=true, title;
        this.each(function(){
            if(!this.grid) {return false;}
            var t = this, vl, ind, cp = typeof cssp, lcdata=t.p.datatype === "local" && t.p.localReader.repeatitems === true? [] : {}, iLocal=0;
            ind = $(this).jqGrid('getGridRowById', rowid);
            if(!ind) { return false; }
            if( data ) {
                try {
                    $(this.p.colModel).each(function(i){
                        nm = this.name;
                        var dval =$.jgrid.getAccessor(data,nm);
                        if( dval !== undefined) {
                            vl = this.formatter && typeof this.formatter === 'string' && this.formatter === 'date' ? $.unformat.date.call(t,dval,this) : dval;
                            if (t.p.datatype === "local" && t.p.localReader.repeatitems === true) {
                                lcdata[iLocal] = vl;
                            } else {
                                lcdata[nm] = vl;
                            }
                            vl = t.formatter( rowid, dval, i, data, 'edit');
                            title = this.title ? {"title":$.jgrid.stripHtml(vl)} : {};
                            if(t.p.treeGrid===true && nm === t.p.ExpandColumn) {
                                $("td[role='gridcell']:eq("+i+") > span:first",ind).html(vl).attr(title);
                            } else {
                                $("td[role='gridcell']:eq("+i+")",ind).html(vl).attr(title);
                            }
                        }
                        if (nm !== "cb" && nm !== "subgrid" && nm !== "rn") {
                            iLocal++;
                        }
                    });
                    if(t.p.datatype === 'local') {
                        var id = $.jgrid.stripPref(t.p.idPrefix, rowid),
                        pos = t.p._index[id], key;
                        if(t.p.treeGrid) {
                            for(key in t.p.treeReader){
                                if(t.p.treeReader.hasOwnProperty(key)) {
                                    delete lcdata[t.p.treeReader[key]];
                                }
                            }
                        }
                        if(pos !== undefined) {
                            t.p.data[pos] = $.extend(true, t.p.data[pos], lcdata);
                        }
                        lcdata = null;
                    }
                } catch (e) {
                    success = false;
                }
            }
            if(success) {
                if(cp === 'string') {$(ind).addClass(cssp);} else if(cssp !== null && cp === 'object') {$(ind).css(cssp);}
                $(t).triggerHandler("jqGridAfterGridComplete");
            }
        });
        return success;
    }
});

我稍后会将我的建议发布到 trirand。所以可以希望下一个版本的jqGrid能解决这个问题。

于 2014-01-18T12:24:48.113 回答