1

我正在尝试使用 ajax 将两个 jqgrids 加载到一个页面上。我的问题是第一个网格加载速度非常快,第二个需要几秒钟。翻阅第二个页面也需要几秒钟。

这是我的代码的结构。这是使用页面上的表格元素调用 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);
    });
  });

两个网格都加载并按预期工作,但第二个网格非常缓慢。两个网格都有大约 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

可能您不使用gridview: true选项并使用较大的值rowNum(有关更多详细信息,请参阅答案)。在 2 个网格中加载 3000 行通常不会那么慢。一个更典型的网格喘气低的原因是在循环内部loadCompletegridComplete回调中使用了对网格的一些修改。如果上述建议对您没有帮助,您应该发布您的代码。

顺便说一句,使用 JSON 而不是 XML 可以减少传输数据的大小。也强烈建议使用 GZIP 或对服务器响应进行 deflate 压缩。通常,这只是您的 Web 服务器配置的标准。

于 2013-06-02T15:12:31.507 回答
0

需要思考的几个问题:

为了缩小问题的范围,您是否尝试仅加载第二个网格并查看它本身是否很慢?如果没有,请尝试切换加载顺序,即在第一个网格之前加载第二个网格。

以下是一些加快网格中数据显示的方法:

1) 调用 build_ _ _grid(); 在页面的 $(document).ready() 函数中。和 onClick 事件,只需使用 ajax 调用并将数据加载到网格中

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

2)删除超时 - 如果您必须加载具有时间延迟的网格,请在另一个网格的 loadComplete 事件中加载一个网格。

3) 对服务器进行一次 AJAX 调用,并在单个响应中获取两个网格数据。现在在 JavaScript 中分离每个网格的行数据并加载两个网格。

于 2013-06-01T23:32:40.520 回答