14

jqgridのgetChangedCellsメソッドを使用してデータが変更されたかどうかを判断する例はありますか？

jqgridのダウンロード可能なデモでgetChangedCellsをgrepしましたが、getChangedCellsの使用例ではなく、関数定義しか見つかりませんでした。

私がやりたいのは、ユーザーが別の行をクリックした場合にユーザーが行った編集を保存することです。ただし、行がダーティの場合にのみ保存を送信したいと思います。

よろしくお願いします、-ネイト

4

5 に答える 5

5

行に安全なダーティ フラグはありません。行編集の開始時 (インライン編集モードの開始時) に、メソッドeditRoweditable="1"がグリッド行 (<tr>要素)に属性を追加するという事実を使用できます。その後、メソッドsaveRowおよびrestoreRowによって属性値が に変更されeditable="0"ます。したがって、インライン編集モードで少なくとも 1 回あった現在のページの行には、editable属性があります。テーブル要素のIDが「リスト」の場合、編集された行を見つけることができます

$("#list tr[editable]")

セットの要素のIDは、行のROWIDです。

グリッドでページングを使用する場合は、注意して、ページを変更する前に現在のページで編集された行の ID を保存する必要があります。ここでonPagingイベントが役立ちます。

私の意見では、必要なことを行うための最善かつ最も安全な方法は、 editRowまたはsaveRowaftersavefuncメソッドのパラメーターを使用することです (おそらくeditRowのみを直接使用します)。関数内で、変更された行の ID を配列/マップに保存できます。これで問題が解決し、安全に作業できます。aftersavefunc

于 2011-06-15T17:37:32.040 に答える
4

最後に、私は何とかコードを持ってきて、私たちが欲しいものを検出することができました;）

うまくいけば、そこにいるjqgridの達人（Olegなど）は、このコードを確認して改善するのに十分な時間があります。

サンプルコードは、 「name」という名前の編集可能なフィールドを持つグリッドで変更されたデータを検出するために機能します。より多くの列で変更されたデータを確認する場合は、変数を追加after_editしbefore_editてその列に関連付ける必要があります。

関数内の前のセルデータを取得するために、ドキュメントで赤で示されているため、このメソッドonSelectRowは使用しませんでした。getCell

行またはセルを編集するときは、この方法を使用しないでください。これにより、入力要素の実際の値ではなく、セルの内容が返されます

恥ずべきことで、ドキュメントが正しいことを確認できました:(。ただし、getCell関数は現在のセルデータで正しく機能します。

そしてここにコードがあります：

 // Declare variables used for inline edit functionality.
 var last_selected;
 var before_edit_value;
 var after_edit_value;
 $('#grid-id').jqGrid({
...

onSelectRow: function(row_id){
    if(row_id && row_id !== last_selected) {
        /*
         * Determine if the value was changed, if not there is no need to save to server.
         */
         if (typeof(last_selected) != 'undefined') {
            after_edit_value = $('#grid-id tr#' + last_selected + ' .name_column input').val();
         }

        if (before_edit_value != after_edit_value) {
            /*
             * Save row.
             */
            $('#grid-id').jqGrid(
                'saveRow', 
                last_selected, 
                function(response){
                    /* SuccessFunction: Do something with the server response */

                    return true;    
                }, 
                'http://url.to.server-side.script.com/server-side-script.php', 
                {
                    additional_data: 'example: additional string',
                });
            }
            else {
                /*
                 * Restore the row.
                 */
                $('#grid-id').jqGrid('restoreRow', last_selected);
            }

        before_edit_value   = $('#grid-id').jqGrid('getCell', row_id, 'name');
    }   

    last_selected       = row_id;

    /*
     * Edit row.
     */
    $('#grid-id').jqGrid(
        'editRow', 
        row_id, 
        true, 
        function() {/* OnEditFunction */}, 
        function(response) {
        /* SuccessFunction: Do something with the server response */

        return true;

    }, 
    'http://url.to.server-side.script.com/server-side-script.php', 
    {
        additional_data: 'example: additional string',
    }); 
   },
...
});
于 2011-08-21T22:49:47.683 に答える
2

私のプロジェクトの 1 つで、次のことを行いました。行を編集する前に、行データをグローバル変数に記憶し、編集が完了したら、行データが変更されたかどうかを確認します。このようなもの（ダブルクリックでアクティブ化された編集モード）：

var beforeEditData;

function onGridDblClickRow(id) {
  if (isRowEditable(id)) {
    beforeEditData = grid.getRowData(id);
    grid.editRow(id, true, null, null, 'clientArray', null, onRowAfterEdit);
    ...
  }
}
function onRowAfterEdit(row) {
  var data = grid.getRowData(row);
  if (!isDataChanged(beforeEditData, data)) {        
    return; // No changes
  }
  ... // Save data here
}
function isDataChanged(before, after){
  ... // Allows tricky logic for dirty data, e.g. one may trim spaces etc.
}

于 2011-12-29T13:07:02.820 に答える
1

MVC4とJQueryを使用して、これが私がしたことです

ビューで

<script type="text/javascript">

var $grid = $("#Grid");
var lastSelection;
var datachanged = false;

function gridInitialised() {
    var headers = $('th>div>:input');
    for (var h = 0; h < headers.length; headers[h++].onclick = (function () { if (datachanged) { $grid.saveRow(lastSelection); datachanged = false; } }));
}

function editRow(id) {
    if (id && id !== lastSelection) {
        if (datachanged) { $grid.saveRow(lastSelection); datachanged = false; }
        $grid.restoreRow(lastSelection);
        $grid.editRow(id, true);
        var inputs = $('#'+id+'>td>:input[class="editable"]');
        for (var i = 0; i < inputs.length; inputs[i++].onchange = (function () { datachanged = true; }));
        lastSelection = id;
    }
}
</script>

@Html.Trirand().JQGrid(Model.Grid, "Grid")

モデルで

            Grid.ClientSideEvents.RowSelect = "editRow";
            Grid.ClientSideEvents.GridInitialized = "gridInitialised";

gridInitialized コードは、検索フィルターの変更を処理するためのものです。

デイブ

于 2013-02-26T16:11:02.453 に答える