问题描述
目前使用Chrome v19.0.1084.46（官方版本135956）beta-m
jqGrid 4.3.2（最新版）
问题是无论我的网格，列或包含div的大小，我的最后一列的一小部分被推动超出网格边缘，导致水平滚动条出现，这不应该发生。见下文：
我已经在jqGrid上使用以下属性来尝试并修复：
- code> width
-
$ b c> - 内的 setGridWidth
您可以下载固定版本的 jquery.jqGrid.src 所有修正。如果您必须使用旧版本的jqGrid，您可以在 jquery.jqGrid.src 的代码中进行相同的更改。要为生产创建最小化版本，您可以使用任何您知道的最小化。我使用例如Microsoft Ajax Minifier 4.0。只需安装并执行
AjaxMin.exe jquery.jqGrid.src-fixed3.js -o jquery.jqGrid.min-fixed3 .js
结果你会得到甚至小于原来的 jquery.jqGrid.min.js 。即使您在文件中添加了注释标头（请参阅），该文件将仍然小于 jquery.jqGrid.min.js 的原始版本。 p>
对我的和有一个版本的修复其中方法 cellWidth 介绍：
cellWidth：function（）{
var $ testDiv = $（< div class ='ui-jqgrid'style ='left：10000px' ;< table class ='ui-jqgrid-btable'style ='width：5px;'>< tr class ='jqgrow'>< td style ='width：5px;'>< / td> ;< / tr>< / table>< / div>），
testCell = $ testDiv.appendTo（body）
.find（td）
。宽度（）;
$ testDiv.remove（）;
return testCell！== 5;
}
请参阅。如果你喜欢遵循的方式，你可以做到这一点。在所有 isSafari 或 $。的地方。browser.webkit || $ .browser.safari （在 showHideCol 和 setGridWidth ），
UPDATED 3 ：今天发布了jqGrid 4.3.3其中包含我上面描述的修复（ cellWidth 方法）。
UPDATED 4： Google Chrome 20使用的是WebKit 536.11。所以每个人不能使用最后版本的jqGrid与固定的宽度计算应该使用 parseFloat（$。browser.version）< 536.11 （或一些关闭）而不是在答案开头描述的 parseFloat（$。browser.version）< 536.5 。 Google Chrome 23 WebKit使用537.11。
Currently using Chrome v19.0.1084.46 (Official Build 135956) beta-mjqGrid 4.3.2 (latest release)
The problem is that no matter the size of my grid, columns, or containing div, a small fraction of my last column gets pushed beyond the edge of the grid, causing horizontal scroll bars to appear, which should not happen. See below:
I've been fiddling with the following attributes on jqGrid to try and fix this:
- width
- autowidth
- height
- shrinkToFit
- scrollOffset - Had the best luck with this one, but nothing repeatable.
I've also stripped down to the basic grid css only, thinking it might have been a rule I put in place...with no luck.
Has anyone else experienced this and/or found a solution to this? Help is much appreciated.
I updated today my Chrome to version 19, have reproduced the problem and made the corresponding quick&dirty fix:
I suggest to change the line of jqGrid code
isSafari = $.browser.webkit || $.browser.safari ? true : false;
to the following
isSafari = ($.browser.webkit || $.browser.safari) &&
parseFloat($.browser.version)<536.5 ? true : false; // Chrome < version 19
The demo use the fix. The fixed version of jquery.jqGrid.src.js which I used in the demo you can get here.
I tested it in IE9 (v9.0.8112.16421), IE8 (8.0.6001.18702CO), Chrome 18.0.125.168, Chrome 19.0.1084.46, Safari 5.1.7 (7534.57.2), Firefox 12, Opera 11.62. In all the web browsers the demo has no horizontal scrollbars and it looks as following:
In the future it would be better to change the calculation of width of the grid more deep to have no direct dependency from any version number or web browser. I hope it will be possible if one would use more jQuery methods $.width and $.outerWidth in some places of jqGrid. In any way I hope that the above described fix would be already helpful for many jqGrid users.
UPDATED: I posted my suggestion to trirand as the bug report.
UPDATED 2: To be exactly there are three places in the code where are used the same $.browser.webkit || $.browser.safari construct as described above: inside setGridWidth, inside of getOffset, inside of calculation of the width of multiselect column, inside showHideCol and inside setGridWidth. The first three places uses isSafari variable. The last two places uses $.browser.webkit || $.browser.safari directly. One should replace in all the places the code
$.browser.webkit||$.browser.safari
to
($.browser.webkit || $.browser.safari) && parseFloat($.browser.version)<536.5
So one should do this in three places:
- at the definition of the isSafari (see me original post)
- inside of showHideCol
- inside of setGridWidth
You can download the fixed version of the jquery.jqGrid.src with all the fixes here. You can make the same changes in the code of jquery.jqGrid.src yourself if you have to use old version of jqGrid. To created minimized version for the production you can use any minimizer which you good know. I use for example Microsoft Ajax Minifier 4.0. Just install it and execute
AjaxMin.exe jquery.jqGrid.src-fixed3.js -o jquery.jqGrid.min-fixed3.js
As the result you will get jquery.jqGrid.min-fixed3.js which will be even smaller as original jquery.jqGrid.min.js. Even if you add the comment header to the file (see modified file) the file will be still smaller as original version of jquery.jqGrid.min.js.
After some iterations of my bug report and the improvements there are one more version of the fix where the method cellWidth was introduced:
cellWidth : function () {
var $testDiv = $("<div class='ui-jqgrid' style='left:10000px'><table class='ui-jqgrid-btable' style='width:5px;'><tr class='jqgrow'><td style='width:5px;'></td></tr></table></div>"),
testCell = $testDiv.appendTo("body")
.find("td")
.width();
$testDiv.remove();
return testCell !== 5;
}
See here. If you prefer to follow the way you can do this also. In the case in all places where isSafari or $.browser.webkit || $.browser.safari (in showHideCol and setGridWidth) are used you can use $.jgrid.cellWidth() instead.
UPDATED 3: Today was published jqGrid 4.3.3 which contains the fix which I described above (the cellWidth method). So I recommend all to use the new version.
UPDATED 4: Google Chrome 20 uses WebKit 536.11. So everybody who can't use the last version of jqGrid with the fixed calculation of the width should use parseFloat($.browser.version)<536.11 (or some close) instead of parseFloat($.browser.version)<536.5 described at the beginning of the answer. Google Chrome 23 WebKit uses 537.11.
这篇关于jqGrid在Chrome / Chrome Frame中无法正确呈现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！