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

}

saveRow コード:

 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' の 2 つの編集可能な列があり、これらの列は URL から数値コードを受け取り、適切なテキストを表示するために (colModel の) formatter と unformat を使用します。

フォーマット関数は次のとおりです。

 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]; 
}

問題は最初の関数にありました。行を編集して選択からオプションを選択した後、テキストが数値ではなく cellValue 入力として showTextFmatter 関数に渡され、エラーが行にスローされました。

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

このエラーにより、リロード\復元に失敗しました!

問題のある行の前に条件を追加しました。

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

そして問題は解決しました。

于 2012-08-21T09:32:26.743 に答える