1

ajax を使用して 2 つの jqgrid を 1 つのページにロードしようとしています。私の問題は、最初のグリッドが非常に高速に読み込まれ、2 番目のグリッドが数秒かかることです。秒単位のページングにも数秒かかります。

これが私のコードの構造です。これは、ページ上のテーブル要素で ajax を呼び出す jquery です。

$(document).on("click", "#loadTables", function(){
  $.post("./ajax/page_with_tables.php", {}, function(data){
      $(body).html(data);
      build_first_grid();

      window.setTimeout(function(){
        build_second_grid();  
      }, 10);
    });
  });

両方のグリッドが読み込まれ、機能的には期待どおりに動作しますが、2 番目のグリッドは非常に遅くなります。どちらのグリッドにも約 3000 行あります。「build_*_grid()」関数は、単に jqgrid を呼び出してグリッドを構築するだけで、特別なことは何もありません。どちらも、XML を返す独自の ajax 呼び出しを使用しています。

両方がまったく同時にロードされている場合、グラフィックに問題があるため、タイムアウト機能があります。タイムアウトを短くすると、問題が解決します。

これは、page_with_tables.php からブラウザに送信される html です。

<div id="tableOne"><table id="tableOneData"><tr><td></td></tr></table><div id="tableOnePager"></div></div>

<div id="tableTwo"><table id="tableTwoData"><tr><td></td></tr></table><div id="tableTwoPager"></div></div>

検索して質問しましたが、問題が見つからないようです。助けていただければ幸いです。

4

2 に答える 2

0

考えるべきいくつかの質問:

問題を絞り込むために、2 番目のグリッドだけをロードして、それ自体が遅いかどうかを確認しましたか? そうでない場合は、読み込み順序を変更してみてください。つまり、最初のグリッドの前に 2 番目のグリッドを読み込みます。

また、グリッドでのデータ表示を高速化するいくつかの方法を次に示します。

1) build_ _ _grid(); を呼び出します。ページの $(document).ready() 関数で。そしてonClickイベント、ajax呼び出しを行い、データをグリッドにロードするだけです

jQuery("#tableOneData").jqGrid('setGridParam', {url: ajaxUrl,datatype: "xml"}).trigger("reloadGrid");

2) タイムアウトを削除する - 時間遅延でグリッドをロードする必要がある場合は、もう一方のグリッドの loadComplete イベントで 1 つのグリッドをロードします。

3) サーバーに対して 1 つの AJAX 呼び出しを行い、単一の応答で両方のグリッド データを取得します。JavaScript で各グリッドの行データを分離し、2 つのグリッドをロードします。

于 2013-06-01T23:32:40.520 に答える
0

おそらく、gridview: trueオプションを使用せず、大きな値を使用しますrowNum(詳細については、回答を参照してください)。2 つのグリッドに 3000 行をロードする場合、通常はそれほど遅くはありません。グリッドのパントが低いもう 1 つの一般的な理由は、loadCompleteまたはgridCompleteコールバック内のループでグリッドの変更を使用することです。上記の推奨事項が役に立たない場合は、コードを投稿する必要があります。

ちなみに、XML の代わりに JSON を使用すると、転送されるデータのサイズが小さくなります。サーバー応答の GZIP または deflate 圧縮を使用することも強くお勧めします。通常、これは Web サーバーの構成の指標にすぎません。

于 2013-06-02T15:12:31.507 に答える