2

(ボタンをクリックして) 手動で再描画すると、jquery データテーブルが 2 回投稿されているようです。データテーブルがこれを行わないようにするにはどうすればよいですか?

ここに私のクライアント側のコードがあります:

$(document).ready(function () {
    dataTable = $('#Results').dataTable({
        "bLengthChange": true,
        "bFilter": false,
        "bSort": true,
        "bInfo": true,
        "bAutoWidth": false,
        "sPaginationType": "bootstrap",
        "sDom": "ftrpli",
        "bServerSide": true,
        // "sAjaxSource": "AjaxControllerAction",
        "fnServerParams": function (aoData) {
            aoData.push({ "name": "UserId", "value": $('#UserId').val() });
            aoData.push({ "name": "Data", "value": $('#Data').val() });
            aoData.push({ "name": "Location", "value": $('#Location').val() });
        },
        "fnServerData": function (sSource, aoData, fnCallback) {
            showProgress();

            var headers = {};
            headers['__RequestVerificationToken'] = token;
            alert('zzzz');

            $.ajax({
                dataType: 'json',
                type: 'POST',
                //url: sSource,
                url: 'AjaxControllerAction',
                data: aoData,
                headers: headers,
                success: function (json) {
                    hideProgress();

                    fnCallback(json);
                },
                error: function (json) {
                    hideProgress();
                }
            });
        },
        "fnDrawCallback": function () { hideProgress(); },
        "bProcessing": false,
        "aoColumns": [
                { "sName": "NAME",
                    "fnRender": function (oObj) {
                        return '<a href="Details/' +
                        oObj.aData[0] + '">' + oObj.aData[0] + '</a>';
                    }
                },
                { "sName": "DATA" },
                { "sName": "DATA1" },
                { "sName": "DATA2" },
                ]
    });
}
);

$("#SearchForm").on("submit", function (event) {
    event.preventDefault();
    // this sends the request twice ??
    dataTable.fnDraw();
});

firebug (xmlhttprequest が 2 回表示されます) の両方を使用して AjaxControllerAction に 2 回ヒットしていることと、ブレークポイントを設定してアクションに 2 回ヒットしていることがわかります。これを行う理由が見つかりません。ありがとう！

4

4 に答える 4

1

私の解決策

datatables のパラメーターを使用しました: iDisplayStart -> 現在のデータ セットの開始点を表示します。

ステップ 1: データを永続化するためのグローバル変数を作成します。

var options = {
    jsonResultDataTableFromServer: {},
    iDisplayStart: -1,
    iDisplayLength : -1
};

ステップ 2: ajax fnServerData 関数を次のように変更します。

"fnServerData": function(url, data, callback) {
               //data[3] i.e iDisplayStart
               //data[4] i.e iDisplayLength
               if (options.iDisplayStart != data[3].value || options.iDisplayLength != data[4].value) {
                    options.iDisplayStart = data[3].value;
                    options.iDisplayLength = data[4].value;

                    $.ajax({
                        "url": url,
                        "data": data,
                        //"success": callback,
                        "success": function(json) {
                            options.jsonResultDataTableFromServer = json;
                            callback(json);
                        },
                        "contentType": "application/x-www-form-urlencoded; charset=utf-8",
                        "dataType": "json",
                        "type": "POST",
                        "error": function() {
                            alert("DataTables warning: JSON data from server failed to load or be parsed. " +
                                "This is most likely to be caused by a JSON formatting error.");
                        }
                    });
                } else {
                    options.jsonResultDataTableFromServer.sEcho = eval(options.jsonResultDataTableFromServer.sEcho) + 1;
                    callback(options.jsonResultDataTableFromServer);
                }

                return false;
            },
于 2014-03-27T14:39:30.197 に答える
0

それは変だ。dataTable.fnDraw();1 つの AJAX 呼び出しを送信する必要があります。おそらく、プラグイン スクリプトを調べて、そこで何が起こっているかを確認する必要があります。しかし、最初に新しいバージョンを試してください:)

再描画時にその AJAX 呼び出しを無効にしようとしています。解決策が見つかったら、ここに投稿します

于 2013-10-16T05:40:22.727 に答える
0

jQuery dataTable 1.9 (レガシーバージョン) を使用して同様の問題が発生しました。table.dataTable を呼び出して AJAX POST 接続を準備し、次に fnDraw を呼び出していました。fnDraw への 2 番目の呼び出しはまったく必要なく、2 番目の Ajax 要求が排除されたことが判明しました (table.dataTable と fnDraw の両方が、テーブルを表示する jsp 内の $(document).ready 関数に配置されました)。table.dataTable だけですべての機能が処理されました (新しい基準でコントローラーを呼び出します)。最初のコントローラー呼び出しでは、既定のビューが表示されました。ユーザーが列の並べ替えアイコンをクリックすると、コントローラーが再度呼び出されて、新しい並べ替え条件が渡され、適切な SQL クエリが生成されました。ユーザーがページネーション アイコンをクリックすると、コントローラーが呼び出され、ページネーション用の適切な SQL クエリが生成されました。

于 2014-07-15T23:01:37.537 に答える
0

これは、データテーブルを初期化した変数として同様の名前「dataTable」を使用したことが原因である可能性があります

dataTable = $('#Results').dataTable({

これが、手動で再描画したときにデータテーブルが 2 回描画される理由である可能性があります。変数名を変更して確認してみてください。

于 2012-10-04T11:34:06.280 に答える