2

オプションでjqGrid 4.3.2を使用していinlineNavます。グリッド上のすべての編集は、 および を使用してローカルで行われloadonce: trueますclientArray。ユーザーが編集を終了したら、フォームの保存ボタンをクリックすると、グリッド全体がサーバーにポストされます。ほとんどの場合、これはうまく機能しますが、私は奇妙なことに遭遇しました。ユーザーが新しい行を追加し、Enter キーを押して編集を確認するか、新しく追加された行の選択を解除する前に [保存] ボタンをクリックすると、インライン ナビゲーターの追加ボタンは、saveRow投稿および再読み込みの前に呼び出した後でも無効のままになります。電話の後に試してみましresetSelectionたが、どちらも機能しません。私の保存コード:restoreRowsaveRow

$("#submitButton").click(function () {
    $("#theGrid").jqGrid('saveRow', $("#selectedRowId").val(), false, 'clientArray');
    if (!ValidateGridData())
        return false;
    var rowData = $("#theGrid").jqGrid('getRowData');
    var dataToSend = JSON.stringify(rowData);
    $.ajax({
        url: '@Url.Action("UpdateGridData")',
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        data: dataToSend,
        dataType: 'json',
        async: false,
        success: function (data, textStatus, jqXHR) {
            $("#theGrid").jqGrid('setGridParam', { datatype: 'json' });
            $("#theGrid").trigger('reloadGrid');
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert('Error saving data: ' + textStatus + " " + errorThrown);
        }
    });
    return true;
});

新しい行が保存され、ユーザーがさらに行を追加できることをインラインナビゲーターに納得させる方法はありますか?

4

1 に答える 1

5

inlineNavメソッドによってナビゲーターに追加されたボタンには、グリッド ID と対応するサフィックスから構築された ID があります。

  • 追加: gridId + "_iladd" (例: "list_iladd")
  • 編集: gridId + "_iledit" (例: "list_iledit")
  • 保存: gridId + "_ilsave" (例: "list_ilsave")
  • キャンセル: gridId + "_ilcancel" (例: "list_ilcancel")

ボタンを有効にするには、'ui-state-disabled'CSS クラスを削除する必要があります。

var gridId = "list";
$("#" + gridId + "list_iladd").removeClass('ui-state-disabled');

ボタンを無効にするには、.addClass('ui-state-disabled')代わりに使用できます。

saveRowさらに、直接のようなインライン編集方法を使用することはお勧めしません。その場合、解決しようとしている問題はおそらくないでしょう。answerのコードを見てください。とを次のように定義editingRowIdします。myEditParam

var $grid = jQuery("#list"),
    editingRowId,
    myEditParam = {
        keys: true,
        oneditfunc: function (id) { editingRowId = id; },
        afterrestorefunc: function (id) { editingRowId = undefined; }
    };

次に、パラメーターで使用inlineNavしmyEditParamます。

$grid.jqGrid('inlineNav', '#pager',
    { edit: true, add: true, editParams: myEditParam,
        addParams: {addRowParams: myEditParam } });

editingRowId現在編集中の行のIDを取得するか、編集中の行がない場合は確実に取得できますundefined。そのため、 editRow$(gridIdSelector + "_iledit").click();の代わりに使用して、現在選択されている行を編集できます。同じように、必要に応じてsetSelectionを使用して、他のインライン編集ナビゲーター ボタンのクリックをシミュレートできます。

UPDATED : 必要に応じて、 のsaveRow内部で の呼び出しを組み合わせることonSelectRowができますが、最初に変数を使用し、使用するすべての編集方法に共通editingRowIdする秒数を使用できます。myEditParam

onSelectRow: function (id) {
    var $this = $(this);
    if (editingRowId !== id) {
        if (editingRowId) {
            // save or restore currently editing row
            $this.jqGrid("saveRow", editingRowId, myEditParam);
            // or $this.jqGrid("restoreRow", editingRowId, myEditParam);
        }
        $this.jqGrid("editRow", editingRowId, myEditParam);
    }
}

インライン編集方法の他のオプションが必要な場合は、myEditParam. ほとんどのインライン編集の例で見editingRowIdられる変数として使用する方がはるかに優れていることがわかります。lastSel

于 2012-06-04T20:09:34.437 に答える