0

我正在尝试向我的 jqgrid 添加一个新行,允许用户进行内联编辑,通过单击“保存”按钮保存它,然后使用添加的数据自动重新加载网格。

我的问题是过程的重新加载部分:

jqgrid 声明:

jQuery("#gridMsg").jqGrid({
        url: '@Url.Content("~\\MessagesAndDeliveryInfo\\GetMessageAndDeliveryForDecisionImplementation\\")' + '?decisionImplementationId=' + '@Model.DecisionImplementationId',
        datatype: "json",
        contenttype: "application/json; charset=utf-8",
        mytype: "GET",
        editurl: '@Url.Content("~\\MessagesAndDeliveryInfo\\SaveExistingMessage\\")',
        colNames: ['Msg No.', 'Date', 'Delivery Mode', 'Delivery Number', 'Confirmation Mode', 'Confirmation Date', 'IsVoucherCreated', 'Id'],
        colModel: [
                { name: 'MessageNumber', index: 'MessageNumber', width: 90 },
                { name: 'ProjectionDate', index: 'ProjectionDate', width: 90 },
                { name: 'DeliveryMode', index: 'DeliveryMode', width: 140, editable: true, edittype: "select", editoptions: { value: '@Model.DeliveryModeSelectOptions' }, formatter: showTextFmatter, unformat: unformatShowText },
                { name: 'DeliveryNumber', index: 'DeliveryNumber', width: 150, editable: true, edittype: "text" },
                { name: 'DeliveryConfirmationMode', index: 'DeliveryConfirmationMode', width: 110, align: "right", editable: true, edittype: "select", editoptions: { value: '@Model.DeliveryConfirmationModeSelectOptions' }, formatter: showTextFmatter, unformat: unformatShowText },
                { name: 'LegalDeliveryDate', index: 'LegalDeliveryDate', width: 90, align: "right", editable: true },
                { name: 'IsVoucherCreated', index: 'IsVoucherCreated', width: 90, align: "right", editable: false, hidden: true },
                { name: 'IdForSendMailService', index: 'IdForSendMailService', width: 90, align: "right", editable: false, hidden: true },

            ],

        rowNum: 10,
        rowList: [10, 20, 30],
        pager: '#pagerMsg',
        direction: "rtl",
        viewrecords: true,
        caption: "Messages",
        onSelectRow: function (id) {

            if (id && id != lastsel2) {
                jQuery('#gridMsg').jqGrid('restoreRow', lastsel2, function (response) { debugger; });
                jQuery('#gridMsg').jqGrid('editRow', id, true);
                lastsel2 = id;
            }
        },

        jsonReader: {

            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false,
            cell: "cell",
            id: "id",
            userdata: "userdata"
        },
        loadError: function (jqXHR, textStatus, errorThrown) {
            debugger;
        }

    });
    jQuery("#gridMsg").jqGrid('navGrid', '#pagerMsg', { edit: false, add: false, del: false });

添加和编辑行代码:

     function AddRowToGrid()
{
    rowId = 99;
    var mydata = [
                    { MessageNumber: rowId, ProjectionDate: '@DateTime.Now.ToShortDateString()', DeliveryMode: '@Model.OPTIONS_DEFAULT_VALUE', DeliveryNumber: "", DeliveryConfirmationMode: '@Model.OPTIONS_DEFAULT_VALUE', LegalDeliveryDate: "", IsVoucherCreated: false, IdForSendMailService: null }
                 ]; 

    //add row
    for (var i = 0; i <= mydata.length; i++)
         jQuery("#gridMsg").jqGrid('addRowData', rowId, mydata[i]);


    //edit added row
    jQuery("#gridMsg").jqGrid('editRow', rowId,
    {
        keys: true,
        oneditfunc: function () {
                    //debugger;//alert("edited");
            }
    });

}

保存行代码:

 function SaveNewRow(rowId)
{

        var saveparameters = {
            "successfunc": null,
            "url": '@Url.Content("~\\MessagesAndDeliveryInfo\\SaveNewMessage\\")',
            "extraparam": { decisionImpId: '@Model.DecisionImplementationId' },
            "aftersavefunc": reload,
            "errorfunc": function (rowId, result, postedData) { alert(result.responseText); restoreRow(rowId); },
            "afterrestorefunc": null,
            "restoreAfterError": true,
            "mtype": "POST"
        }

        jQuery("#gridMsg").jqGrid('saveRow',rowId,  saveparameters);

}

 function reload(rowid, result) {  $("#gridMsg").trigger("reloadGrid"); } 

上面的代码在重新加载网格之前工作正常:即使新行保存在服务器中并且调用了 aftersavefunc:网格没有重新加载并且添加的行保持可编辑模式。只有当我在导航栏中手动单击重新加载网格时,网格才会重新加载,然后我才能看到新行。

希望有人可以帮助我,非常感谢提前。

4

1 回答 1

0

我找到了导致问题的原因!

我在 colModel 中有两个带有 edittype='select' 的可编辑列,这些列从 url 接收数字代码,并使用 formatter 和 unformat (of colModel) 来显示合适的文本。

格式化函数是:

 function showTextFmatter(cellvalue, options, rowObject) {

    var vts = {};
    if (options.colModel.editoptions.values == undefined) {
        vtStr = options.colModel.editoptions.value.split(';');
        for (var i = 0; i < vtStr.length; i++) {
            kv = vtStr[i].split(':'); vts[kv[0]] = vtStr[i];
        }
        options.colModel.editoptions.values = vts;
    }

    if (options.colModel.editoptions.values[cellvalue] != "" && options.colModel.editoptions.values[cellvalue] != undefined)
        return options.colModel.editoptions.values[cellvalue].split(':')[1];
    return cellvalue;
}

function unformatShowText(cellvalue, options) {

    return cellvalue.split(':')[0]; 
}   

问题出在第一个函数中:在编辑行并从 select 中选择一个选项后,文本作为 cellValue 输入而不是数字值传递给 showTextFmatter 函数,并且在行中引发了错误:

return options.colModel.editoptions.values[cellvalue].split(':')[1];    

此错误导致重新加载\恢复失败!

我只是在有问题的行之前添加了一个条件:

&& options.colModel.editoptions.values[cellvalue] != undefined

问题就解决了。

于 2012-08-21T09:32:26.743 回答