0

ユーザーが行をコピーできるようにする2つのグリッドがあります。小さなセットの場合は問題ありませんが、大きなデータセット（5〜1万）の場合、JQGridが非常に遅いことに気付きます。これは私が今持っているものです：

  $('#imgRightArrow').click(function ()
{
    var fromGrid = $('#fromGrid');
    var toGrid = $('#toGrid');
    var rowKeys = fromGrid.getGridParam('selarrrow');
    var j = rowKeys.length - 1;
    if (j >= 0) $('body').addClass('loading');

    (function ()
    {
        for (; j >= 0; j--)                        // - high to low to avoid id reordering
        {
            var row = fromGrid.jqGrid('getRowData', rowKeys[j]);
            toGrid.addRowData('gtp_' + rowKeys[j], row); // - add prefix to keep rowid's unique between grids
            fromGrid.delRowData(rowKeys[j]);

            if (j % 100 === 0)
            {
                $('#fromGridHeader').text(fromGrid.jqGrid('getGridParam', 'records') + ' Cards on this Order');
                $('#toGridHeader').text(toGrid.jqGrid('getGridParam', 'records') + ' Cards to be Dispatched');

                if (j === 0)        // - done
                    $('body').removeClass('loading');
                else
                {
                    j--;
                    window.setTimeout(arguments.callee); // - set a timer for the next iteration 
                    break;
                }
            }
        }
    })();
});

非常に遅いので、ブラウザがタイムアウトするのを防ぐために応急修理を使用する必要があります。

私はこのようなことを試しました：

$('#imgRightArrow').click(function ()
{
    var fromGrid = $('#fromGrid');
    var toGrid = $('#toGrid');

    var copyData = toGrid.jqGrid('getRowData'); // - existing data
    var rowKeys = fromGrid.getGridParam('selarrrow');

    var j = rowKeys.length - 1;
    if (j >= 0) $('body').addClass('loading');

    (function ()
    {
        for (; j >= 0; j--)
        {
            copyData.push(fromGrid.jqGrid('getRowData', rowKeys[j]));
            fromGrid.jqGrid('delRowData', rowKeys[j]);

            if (j % 100 === 0)
            {
                if (j === 0)
                {
                    fromGrid[0].refreshIndex();
                    toGrid.jqGrid('clearGridData', true);
                    toGrid.setGridParam({ data: copyData });
                    toGrid[0].refreshIndex();
                    toGrid.trigger('reloadGrid');

                    $('#fromGridHeader').text(fromGrid.jqGrid('getGridParam', 'records') + ' Cards on this Order');
                    $('#toGridHeader').text(toGrid.jqGrid('getGridParam', 'records') + ' Cards to be Dispatched');
                    $('body').removeClass('loading');
                }
                else
                {
                    j--; // - manually decrement since we break
                    window.setTimeout(arguments.callee); // - set a timer for the next iteration 
                    break;
                }
            }
        }
    })();
});

...高速に見えますが、fromGridから行を削除すると、delRowDataが使用されます。これは非常に低速です。

大量のデータセットに対してこれを効率的に達成する方法についてのアイデアはありますか？

4

2 に答える 2

0

何千もの行が含まれている場合、クライアント側の操作は非常に遅くなります。高速化する最善の方法は、サーバー側で操作を行うことです。たとえば、AJAX 要求の一部として ID をサーバーに渡し、サーバーの応答を受信したときにグリッドを更新できます。

または、ユーザーは本当に 5,000 行を選択してコピーしていますか?それとも、単に「すべてコピー」などの一括操作を実行しようとしているだけですか? このような機能を実装して、全体的なエクスペリエンスを向上させ、ID を AJAX リクエストに渡す必要をなくすことができるかもしれません。

それは役に立ちますか？

于 2013-02-26T20:35:16.480 に答える
0

ctrl+c を押すと、次の方法で選択した行をコピーして貼り付けることができます。

   $(document).ready(function () {

$('#gvMygrid').keyup(function (e) {
    var crtlpressed = false;
    var celValue = "";
    var celValue1 = "";
    var celValue2 = "";
    if (e.keyCode == 17) {
        crtlpressed = true;
    }
    if (e.keyCode == 67 && e.ctrlKey == true) {
        var myGrid = $('#gvMygrid');
        var my_array = new Array;
        my_array = $("#gvMygrid").getGridParam('selarrrow');

         for (var i = 0; i < my_array.length; i++) {

            var rowInfo = $("#gvMygrid").getRowData(my_array[i]);
            if (rowInfo != null)
                var data = JSON.stringify(rowInfo);
            var splitData = data.split('","');

         for (var j = 1; j < splitData.length; j++) {
                celValue1 = celValue1 + splitData[j].split(":")[1] + "      ";
            }
            celValue1 = celValue1 + '\r\n';
        }
        celValue2 = celValue1.replace(/"/g, '');
        celValue = celValue2.replace(/}/g, '');
        crtlpressed = false;
        copyToClipboard(celValue);
    }
    function copyToClipboard(s) {
        if (window.clipboardData && clipboardData.setData) {
            window.clipboardData.clearData("Text");
            clipboardData.setData("Text", s);
        }
    }

});  });

各セルのデータを 4 つのスペースで取得できるように、for ループで 4 つのスペースでデータを分割しています。

于 2014-03-21T09:24:56.260 に答える