列宽问题? (太短或太宽)

Columns width issues? (Too short or too wide)

关于free-jqgrid 4.9.2,是否自动处理列宽?不对,那么正确的处理方式是什么?

1) VIN 和 Year 列包含太多可用空格

2) Trim 包含一些太长而无法适应列宽的记录(例如 1993 Mitsubishi 3000GT 2 Dr VR-4 Turbo AWD Hatchback)

此外,jqGrid 是否在某处设置了 true/false "word wrap"?

演示位于 link removed

Auto-width 从 4.8 版本开始的免费 jqGrid 中存在调整。免费的 jqGrid 仍然不能自动处理所有列的宽度。需要在 colModel 中为应根据最长内容的宽度设置宽度的列添加一些附加属性,并设置一些附加选项。

您当前的代码对 'Vin' 列使用 width: 190,并且没有为任何其他列指定任何 width 属性,因此默认值 width: 150 将会被使用。此外,您使用 jqGrid 的 width: 1022 选项和 错误的 选项 autoWidth: true(而不是 autowidth: true),它们将被忽略。这意味着 div(bDiv 或 body div)在网格上的宽度将设置为 1022px,用户可以使用水平滚动条查看所有列。

我建议您阅读 the wiki article。您可以将 autoResizable: true 属性 添加到某些特定列或使用 cmTemplate: { autoResizable: true } 所有 列中添加 属性。结果,网格的每个单元格的内容将被包裹在 <span class="ui-jqgrid-cell-wrapper">...</span> 中。它允许免费的 jqGrid 获取列的所有单元格内容的确切宽度,然后根据值计算最大值。因此用户可以在列大小调整器(列之间)上 double-click 将宽度设置为最佳值。在宽度计算期间,jqGrid 列的宽度 header 以及排序图标的宽度加上列的网格单元格的宽度。可以使用 autoResizing: { compact: true } 选项来减少没有可见排序图标的列的宽度。最后一个常用选项是 autoresizeOnLoad: true,我建议您使用。它会将具有 autoResizable: true 属性 的列的宽度设置为最佳值。

所以我建议您将以下选项添加到您的网格中:

cmTemplate: { autoResizable: true },
autoResizing: { compact: true },
autoresizeOnLoad: true

之后列的宽度看起来会好很多。

如果您希望将某些列的文本换行(如果它太长),那么您可以使用 the old answer 中描述的 CSS 设置并设置 maxColWidth 属性列的 autoResizing(在 colModel 中)或网格的 autoResizing 选项的全局设置 maxColWidth 到列的最大宽度。较长的文本将被换行。