我想在调整列大小后调整网格的宽度（因此网格的宽度将匹配列的宽度之和，包括调整后的列的新宽度）。这应该也可以防止水平滚动条出现。
这有点类似于this question，除了在隐藏/显示列后调整网格大小之外，我还希望它在扩展/收缩列时调整大小：
如果您查看@Oleg 提供的the question 中的the demo，您会发现网格不会在调整列大小时调整大小。
我可以使用resizeStop 事件，然后使用方法setGridWidth 将网格设置为列宽之和的宽度。我不确定如何对列的宽度求和...也许 JQGrid 中内置了一些东西，我可以用它来轻松地做到这一点？
非常感谢您的任何建议！
【问题讨论】：
标签： javascript jqgrid resize
我个人觉得这个问题很好。我对如何改进网格宽度的计算算法提出了很多建议。我曾两次在我的建议中包含您想要的行为，但 Tony（jqGrid 的开发人员）删除了部分更改。
在当前版本的 jqGrid 中实现您的要求非常容易，但是代码使用了一些内部网格结构。因此，您应该验证相同的技巧是否也适用于下一个版本。 resizeStop回调的代码如下：
resizeStop: function () {
$(this.bDiv).find('>div:first>table.ui-jqgrid-btable:first')
.jqGrid('setGridWidth', this.newWidth);
}
The demo 现场展示了它的工作原理。
jqGrid 的常见解决方案的复杂性更高，因为有时需要保持指定的网格宽度。我的观点如下：如果用户在网格初始化（创建）期间指定width 选项，那么他希望保持宽度。另一方面，如果在创建网格期间未指定 width 选项，则希望（如您所愿）根据所有列的宽度之和计算网格的总宽度。如果某些列宽会改变，网格宽度也应该调整（重新计算）。问题只是在网格创建期间原来的空width 选项将被覆盖。我的建议是在网格创建期间将width 选项的原始 值保存在widthOrg 选项中。因此，我们将能够测试width 选项的原始 值，并在列调整大小后选择网格调整大小的最佳行为。
已更新：在与您讨论 cmets 和 jqGrid 代码调试之后，我希望找到独立于 shrinkToFit 参数值的解决方案。解决方案包括将resizeStop的代码更改为以下
resizeStop: function () {
var $grid = $(this.bDiv).find('>div:first>table.ui-jqgrid-btable:first'),
shrinkToFit = $grid.jqGrid('getGridParam', 'shrinkToFit');
$grid.jqGrid('setGridWidth', this.newWidth, shrinkToFit);
}
并更改 jqGrid 的内部showHideCol 方法的两行。首次更改the line
cw = this.widthOrg? this.widthOrg: parseInt(this.width,10);
到
cw = this.widthOrg && $t.p.shrinkToFit ? this.widthOrg: parseInt(this.width,10);
以及another line的更改
$($t).jqGrid("setGridWidth",$t.p.shrinkToFit === true ? $t.p.tblwidth : $t.p.width );
到
$($t).jqGrid("setGridWidth", $t.p.tblwidth);
你可以得到jqGrid的修改版here。 The first demo 使用带有shrinkToFit: true 的代码，the second demo 使用相同的代码，但没有shrinkToFit: true 选项。
我虽然在第二天如何使修复工作也可以在创建时使用 jqGrid 的固定width 选项的情况下，并将我的建议发布到 trirand 论坛。
如果您想使用 jqGrid 的最小化版本，您可以自己最小化它或使用 original jqGrid 最小化版本并仅覆盖 showHideCol 相对于 $.jgrid.extend 的方法。见the demo。
更新：在 jqGrid 的更高版本中更改this 的值后，应将上述resizeStop 回调代码更改为以下代码：
resizeStop: function () {
var $self = $(this),
shrinkToFit = $self.jqGrid("getGridParam", "shrinkToFit");
$self.jqGrid("setGridWidth", this.grid.newWidth, shrinkToFit);
}
【讨论】：
shrink 的setGridWidth 还是jqGrid 的shrinkToFit 选项？您能否更准确地描述您的 jqGrid 具有哪些设置（尤其是您使用的 shrinkToFit 和 forceFit 的值）。您能否另外描述确切在 1) 后一列将由用户调整大小（列上的宽度将减小或增加）2) 一列将是由列选择器隐藏或显示。
shrinkToFit、forceFit 等，因为我没有定义它们）。但是，我添加了shrinkToFit: false，以便调整列大小不会按比例扩展/缩小其他列。添加shrinkToFit: false 破坏了网格在添加/删除列后自动调整大小。
我做一个函数
var grid_setAutoWidth = function() {
var columnas = $(this).jqGrid('getGridParam', 'colModel');
var anchoTotal = 0;
for (var i = 0; columnas[i]; i++) {
anchoTotal += columnas[i].width;
}
anchoTotal += 50;
$(this).jqGrid('setGridWidth', anchoTotal);
};
...然后，在网格参数中
shrinkToFit: false,
loadComplete: grid_setAutoWidth,
resizeStop: grid_setAutoWidth,
我认为这是最简单的方法
【讨论】：