Jqgrid - 未捕获RangeError:超出最大调用堆栈大小 [英] Jqgrid - Uncaught RangeError: Maximum call stack size exceeded

查看:205
本文介绍了Jqgrid - 未捕获RangeError:超出最大调用堆栈大小的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

动态列宽根据其内容



我试着根据内容动态调整列宽,通过查找字符长度然后最终获得最大长度并将其设置为网格列宽。

  loadComplete:function() {
$(#grid)。on(jqGridAfterLoadComplete jqGridRemapColumns,function(){
var $ this = $(#grid),
colModel = $ this.jqGrid (getGridParam,colModel),
iCol,
iRow,
行,
行,
n = $ .isArray(colModel)?colModel.length: 0;
var rowData =;
var rowDataLen =;
var input = [];
var divs = $(div);
var colWidth = 125;
(iCol = 0; iCol< n; iCol ++){
input = [];
for(iRow = 0,rows = this.rows; iRow row = rows [iRow];
rowData = $(row.cells [iCol])。find(divs).html();
if(rowData!= undefined)
rowDataLen = rowData.length;
input.push(rowDataLen);
}
var finalWidth = Math.max.apply(null,input);
if(finalWidth< colWidth)
finalWidth = colWidth;
$(#grid)。jqGrid(setColWidth,iCol,finalWidth);
var gw = $(#grid)。jqGrid('getGridParam','width');
$(#grid)。jqGrid('setGridWidth',gw);
}
});
},

,它工作正常。



然而,它太慢了,并且越来越多 Uncaught RangeError:超过了最大调用堆栈大小



500元。



任何人都可以帮助调整上述解决方案,以便它可以更快?

这是我的HTML代码:



 < td role =gridcellstyle =text-align:left; 伪造热锻造热锻造热锻造热锻造热锻造热锻造热锻造热锻造热锻造热锻造热锻造热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件热锻件forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot- forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot- forgedHot-forgedHot锻造。咏叹调-describedby = grid_test > 
< div style =max-height:120px>热伪造热伪造热伪造热伪造热伪造热伪造热伪造热伪造热伪造热伪造热伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造伪造-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot -forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot 。-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot锻造< / I><峰; br><峰; br>< I> tttttttttttttttttttttttttttttttt< / I>< / DIV>< / TD>

我实际上找到了div内容的最大字符大小..我也直接尝试以< td> 这种方式取得title属性 - rowData = $(row.cells [iCol])。attr('title'); - 但它也给出相同的错误



固定行高的colum模型格式化程序:



formatter:function(cellvalue){if(cellvalue == undefined || cellvalue == null){
cellvalue =;
}
return''+ cellvalue +''; },



或者我该如何减少这段代码的性能?请帮助..

解决方案

您发布的代码是错误的,但我相信您有代码的其他位置这是 title 和长单元格内容的来源。



您发布的代码中的主要错误: 你不应该对 loadComplete 内部的网格进行绑定。 loadComplete 将被执行多次。在每次执行时,您都会添加一个绑定,这是错误的。而不是你应该移动 $(#grid)。on(jqGridAfterLoadComplete jqGridRemapColumns,function(){...}); 并在创建之前设置它格。您应该了解 jqGridAfterLoadComplete 是每次都会在 loadComplete 之前触发的事件。我想你会以某种方式产生递归。



我会强烈建议你迁移到免费jGrid (参见这里)或者至少使用 autoWidthColumns 我发布在中的方法jQuery.jqGrid.autoWidthColumns .js (请参阅此处)。有关详情,请参阅答案旧版演示。你需要的只是在创建网格之前使用 $(#grid)。jqGrid(autoWidthColumns); 。所有需要的绑定( $(#grid)。on(jqGridAfterLoadComplete jqGridRemapColumns,function(){...}); )执行方法 autoWidthColumns 内部。


Dynamic Column width According to Its Content

I tried adjusting the column width dynamically according to the content this way ,by finding characters length of each row ,then finally getting the max length out of it and setting it to grid column width.

loadComplete : function () {
                $("#grid").on("jqGridAfterLoadComplete jqGridRemapColumns", function () {
                var $this = $("#grid"),
                colModel = $this.jqGrid("getGridParam", "colModel"),
                iCol,
                iRow,
                rows,
                row,
                n = $.isArray(colModel) ? colModel.length : 0;
                var rowData = "";
                var rowDataLen="";
                var input = [];
                var divs = $( "div" );
                var colWidth=125;
                for (iCol = 0; iCol < n; iCol++) {
                            input = [];
                            for (iRow = 0, rows = this.rows; iRow < rows.length; iRow++) {
                                        row = rows[iRow];
                                        rowData = $(row.cells[iCol]).find(divs).html();
                                        if(rowData != undefined)
                                            rowDataLen = rowData.length;
                                        input.push(rowDataLen);
                            }
                            var finalWidth =  Math.max.apply(null, input);
                            if(finalWidth < colWidth)
                                finalWidth = colWidth;
                            $("#grid").jqGrid("setColWidth", iCol, finalWidth);
                            var gw = $("#grid").jqGrid('getGridParam','width');
                            $("#grid").jqGrid('setGridWidth',gw);
                       }                    
            });     
        },

and it is working fine.

However it is too slow and getting Uncaught RangeError: Maximum call stack size exceeded

error when I have more records like 500.

Can anyone help to tweak the above solution so that it can be faster?

Here is my HTML Code:

<td role="gridcell" style="text-align:left;" title="Hot-forged Hot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forged." aria-describedby="grid_test">
<div style="max-height: 120px">Hot-forged Hot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forgedHot-forged.</i><br><br><i>tttttttttttttttttttttttttttttttt</i></div></td>

I am actually finding the max character size of the div content..i also tried directly taking the title attribute of <td> this way- rowData = $(row.cells[iCol]).attr('title'); - but it is also giving the same error

colum model formatter for fixed row height:

formatter : function(cellvalue){ if(cellvalue == undefined || cellvalue == null) { cellvalue = ""; } return '' + cellvalue + ''; },

Or how can i reduce the performace of this code? Please help..

解决方案

The code which you posted is wrong, but I'm sure that you have other place of your code which is the origin of long title and long cell content.

The main error in the code which you posted: you should don't make binding to the grid inside of loadComplete. loadComplete will be executed multiple times. On every execution you add one more binding, which is wrong. Instead of that you should move $("#grid").on("jqGridAfterLoadComplete jqGridRemapColumns", function () {...}); and set it before creating the grid. You should understand that jqGridAfterLoadComplete is event which will be triggered before loadComplete every time. I suppose that you produces recursion in some way.

I would strictly recommend you to migrate to free jGrid (see here) or at least to use autoWidthColumns method which I published in jQuery.jqGrid.autoWidthColumns.js (see here). See the answer for more information and the old demo. What you will need is just to use $("#grid").jqGrid("autoWidthColumns"); before creating the grid. All required bindings ($("#grid").on("jqGridAfterLoadComplete jqGridRemapColumns", function () {...});) do the method autoWidthColumns internally.

这篇关于Jqgrid - 未捕获RangeError:超出最大调用堆栈大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆