Question

我有一些数据库（JSON格式），用于同时显示图表（一次服务器调用），处理这些数据以在jqgrid中创建一个表。

有时，网格中的行数最多为5000，因此浏览器冻结/挂起一段时间，直到处理数据为止，因为它循环了5000次。

我认为一次处理一页数据可能会解决问题，当用户请求另一个页面时，我将在事件onPaging中处理它并使用grid.addRowData()显示下一组行。但是，当最初仅在处理第一组行时定义网格时，我无法找到设置网格中总页数的方法，因此它总是显示1页并且分页选项被禁用。

有一个参数可以给出总页数lastpage，但它是一个只读参数，有没有其他方法可以处理这种情况？

示例：

            var data; //contains 5000 rows
            var tempData;  //iterate only required number of times on data to get 10 rows
            $('#gridId').jqGrid({datatype : "local",
                        data : tempData,
                       //other parameters,
            onPaging: function(pgButton){//do data handling}
});

因此，简而言之，我要求或想要实现的是立即在客户端获取所有数据并将其插入jqGrid，因为当用户需要时，是否可能？我无法找到这种情况的任何例子。

编辑，代码：

        var tableData = [];
        var td = {
            tableData : null,
            colNames : [],
            colModel : []
        };

        var table = $("#table");
        //this processing takes aroung 1.38 seconds for a complexity of 5000 for these loops
        var nrOfTp = responseData[0].length;
        for ( var i = 0; i < nrOfTp; i++) {
            for (s in responseData) {

                var data = responseData[s].chartsData;
                //data[i].label are values like "High<br />123"
                var splittedLabel = data[i].label.split("<br />");

                processedResponse.push({
                    beginTP : new timezoneJS.Date(
                            parseFloat(data[i].x),
                            timeZone)
                            .toString("yyyy-MM-dd HH:mm:ss.S z"),
                    a : splittedLabel[0],
                    v : data[i].y == "null" ? "-" : splittedLabel[1],
                    p : data[i].y == "null" ? "-" : data[i].y,
                    beginAsTimestamp : data[i].x
                });
            }
            processedResponse.sort(compare);
            processedResponseFinal = processedResponseFinal.concat(processedResponse);
            processedResponse = [];
        }

        td.tableData = processedResponseFinal;

        td.colNames = [ aa.views.tpbegin, aa.al.ap, aa.views.xx, '%', '', ''];
        td.colModel = [ {
            name : 'beginTP',
            index : 'beginTP',
            width : 110,
            sortable : false
        },{
            name : 'a',
            index : 'a',
            width : 80,
            sortable : false
        },{
            name : 'v',
            index : 'v',
            width : 40,
            sortable : false,
            formatter : XXCustomFormatter
        },{
            name : 'p',
            index : 'p',
            width : 35,
            sortable : false,
            formatter : XXCustomFormatter
        },{
            name : 'beginAsTimestamp',
            index : 'beginAsTimestamp',
            width : 145,
            sortable : false,
            hidden: true
        },{
            name : 'edit',
            width : 18,
            sortable : false,
            search : false,
            cellattr: function () { return " title='"+aa.views.al+"'"; },
            formatter : function() {
                return "<span class='ui-icon ui-icon-script'></span>";
            }
        }];

        table.jqGrid({
                datatype : "local",
                data : td.tableData,
                colNames : td.colNames,
                colModel : td.colModel,
                pager : "#pager" + this.options.id,
                pginput : true,
                pgbuttons : true,
                recordtext : "",
                rowNum : 13,
                rowTotal : 13,
                loadComplete : function(data) {
                //some other processing
                }});

这就是responseData的样子：

Answer 1

您发布的代码不能解释您遇到任何性能问题的原因。我只能猜测loadComplete中的错误代码可能是您遇到问题的原因。

一般情况下，如果您使用的页面大小不是很大，jqGrid应该可以非常快速地处理5000行的数据。您使用的值rowNum : 13足够小。我建议您使用最新版本的free jqGrid（当前版本为4.13.3），您可以直接从CDN加载（请参阅the wiki article）。免费的jqGrid是jqGrid的一个分支，我从2014年底开始开发，将其重命名为Guriddo jqGrid JS，主要用于jqGrid商业广告（见the prices），更改其许可协议（参见{{3 }}）。我在相同条件下提供免费的jqGrid（许可证MIT / GPLv2，免费），就像旧版本的jqGrid一样。我使用4.x.y形式的版本号，因为我试图保持与旧的4.x版本jqGrid的兼容性。我认为将4.5.2替换为4.13.3可以毫无问题地工作。您仍然可以修改代码以使用我在免费jqGrid中实现的许多新选项。

the post 可用于查看使用13列加载5000行数据并在每页显示25行行的性能。您可以在某些列中设置过滤器，更改排序，使用分页等。相应操作的时间将显示在警报中。

更新：我怀疑用于填充timezoneJS.Date的{{1}}和以下.toString的来电可能相对广泛。这可能需要花费最多的时间。我建议您考虑直接填写beginTP作为data[i].x列的数据，并使用自定义格式化程序，您可以使用beginTP。它会大大减少timezoneJS.Date的调用次数：从5000到13（页面大小）。

是否可以在jqgrid中操作客户端的数据？

1 个答案: