具有大行的 jqGrid 滚动错误

Question

Guriddo jqGrid JS 版本：4.7.0.

(function ($) {
  'use strict';
  $(function () {
    $('#jqGrid').jqGrid({
      url: '../StrictRoutesRebirth/StrictRoutes/',
      mtype: 'GET',
      datatype: 'json',
      colModel: [{
        label: 'id',
        name: 'id',
        hidden: false,
        key: true
      },
      {
        label: 'Примечание',
        index: 'note',
        name: 'note'
      },
      {
        label: 'Логин',
        index: 'userLogin',
        name: 'userLogin',
        hidden: true,
        edittype: 'text'
      }],
      scroll: 1,
      height: 500,
      width: 500,
      rowNum: 50,
      rownumbers: true,
      pager: '#jqGridPager',
      prmNames: {
        nd: null,
        search: null,
        page: 'page',
        rows: 'pageSize',
        sort: 'sortKey',
        order: 'sortOrder',
        totalrows: 'totalQty'
      },
      jsonReader: {
        root: 'data.entries',
        // page: 'data.pager.page',
        total: 'data.pager.totalPages',
        records: 'data.pager.totalQty'
      }
    });
  });
})(jQuery);

当 jqGrid 在启用 scroll: 1 的情况下遇到长文本字段（第四个网格以呈现具有大高度的行）时，jqGrid 会出现故障并且无法工作。附上 screencast 以显示问题。

Answer 1

我在之前的回答中写过，当前虚拟滚动的实现有很多限制。我写道，如果确实需要。

，我不建议使用 jqGrid 的功能

你在问题中描述的限制很明确。您可以检查 the lines of jqGrid code to see that jqGrid get the outerHeight of the first row (see the line) and multiply it on the number of rows (see the line and the line)。然后将结果用于计算滚动后应设置的新页数。

所以很明显，如果不同行的高度不同，则不能使用 jqGrid 的虚拟滚动功能。

当前虚拟滚动的实现还有很多其他问题。最重要的是在 Internet Explorer 中可以显示的行数限制。如果您只是打开 the page in Internet Explorer you will see only the first page of data and you will have no possibility to see more data and you will see no advice that displayed data are not all 20 rows which exist in the database. I find the problem much have as the problem which you described. So one try to use scroll: 1 option typically in case of large number of rows, but exactly in the case it works not. See 以获取更多信息。

如果您仔细检查 jqGrid 的文档，您会发现很多地方（如 here）jqGrid 的某些功能或某些方法不适用于虚拟滚动。因此，如果您使用 scroll: 1 作为默认功能，那么您将无法使用 jqGrid 的许多功能。

具有大行的 jqGrid 滚动错误

jqGrid scroll bug with big rows

javascript

jquery

jqgrid

jqgrid-asp.net

infinite-scroll