jqGrid 高度：自动与 reloadGrid答案

【问题标题】：jqGrid height:auto with reloadGridjqGrid 高度：自动与 reloadGrid
【发布时间】：2016-04-21 13:58:29
【问题描述】：

我有一个网格，它使用网格参数height:'auto' 漂亮地加载到我的页面。网格的高度会根据行数进行调整。我将它设置为只加载一页，不管有多少行，所以没有最大高度，也没有寻呼机。

我有一个重新加载网格的方法，它也很有效。问题是，在reloadGrid 完成后，行数通常会发生变化，但网格的高度与最初加载时保持不变。由于设置了height:'auto'，因此没有可用的滚动条，并且额外的行被隐藏且无法访问。我想要的是让网格的高度在重新加载网格数据后自动重新调整以适应行数。

我正在使用 jqGrid Guriddo 版本。

谢谢

【问题讨论】：

我建议您阅读以发布您的标准代码。我冷给你一些提示，如何改进使用免费 jqGrid 的当前新功能。您使用哪个 CSS 框架（jQuery UI、Bootstrap 或两者兼有）？你已经使用 Font Awesome 了吗？你是使用loadonce: true还是你有很多行（>100000）并且已经实现了服务器端的分页、排序和过滤？
那么我建议您只从服务器返回 所有数据一次，并使用简单的 JSON 格式，如 [{...}, .... {...}] 和对象 {...}没有空格的命名属性。您可以使用loadonce: true, forceClientSorting: true 选项。使用rowNum: 20, page: true。要拥有更多漂亮的图标，您应该在页面上包含 FreeAwesome CSS 并使用 iconSet: "fontAwesome" 选项。阅读更多here。我推荐cmTemplate: { autoResizable: true }, autoResizing: { compact: true } 并尝试autoresizeOnLoad: true。
不客气！我看到了老问题。我建议您更改的第一件事是您发送到 jqGrid 的日期格式。最好使用"2016-04-14" 而不是"04/14/2016" 并允许jqGrid 以正确的格式转换日期：通过添加sorttype: "date", formatter: "date", formatoptions: { newformat: "m/d/Y" } 属性。它允许 jqGrid 对列的内容进行排序和过滤。我建议您将template: "number" 添加到JobNum 和QNTYOrdered 列中。
如果JobNum 列中的值是唯一，那么您应该将key: true 添加到JobNum 列中。 jqGrid 将使用 rowids 与列中的内容。如果JobNum 已经包含所需的值并且设置了key: true，则可以返回[{"id": 38863, "Ship_Date": "2016-04-14", "InsertorLabel": "Insert", "Customer": "Cust", "JobNum": 38863, ...}] 之类的服务器数据或不带id 属性。我建议从colModel 中删除所有index 属性并使用cmTemplate: {width:20}，而不是在所有列中使用相同的属性。你可以删除loadError
免费 jqGrid 提供loadError 的默认实现。因此，如果没有loadError，用户将看到错误消息。您可以覆盖 loadError 的默认实现，但不能使用您当前使用的实现。查看the demo 或this one 作为用法示例。

标签： javascript jquery jqgrid

【解决方案1】：

我想您的问题缺少rowNum。旧的（原始的）jqGrid 有一些容易被误解的选项。我在 free jqGrid 中修复了这些问题 - 我开发的 fork。

例如，rowNum 的默认值为 20（请参阅here）。即使网格有没有分页器，也会使用相同的rowNum: 20 值，并且网格只会显示前 20 行，而不会向用户提供任何提示或警告。这很糟糕。例如，如果未定义寻呼机，则免费 jqGrid 将 rowNum 的值从 20 增加到 maxRowNum（默认值为 10000）。顺便说一句，免费的 jqGrid 允许通过pager: true 或toppager: true 定义寻呼机，而无需像<div id="pager"></div> 和pager: "#pager" 的使用那样放置空的<div>。在the wiki article 和this one 中描述了一些类似上面的小改动。

如果您确实想继续使用商业 Guriddo jqGrid JS（请参阅价格 here）而不是升级到免费 jqGrid，那么您只需将 rowNum: 10000 添加到您的网格中即可解决所描述的问题。

【讨论】：

仅供参考，设置 rowNum:10000 确实解决了 Guriddo 的问题，尽管我将继续使用免费的 jqGrid。