JQGrid 真正的滚动问题答案

【问题标题】：JQGrid true scrolling issueJQGrid 真正的滚动问题
【发布时间】：2012-06-19 16:59:48
【问题描述】：

我的 JqGrid 代码如下所示

$('#grid').jqGrid({
    url: '',
    scroll: 1,
    postData: {
        ...
    },
    datatype: "json",
    mtype: 'POST',
    colNames: [....],
    colModel: [{
        name: 'source',
        index: 'source',
        width: '100',
        align: 'center',
        stype: 'select',
        searchoptions: {
            dataUrl: 'getSource'
            }
    }, { ...
    }],
    rowNum: 200,
    height: '450px',
    autowidth: false,
    shrinkToFit: true,
    rownumbers: true,
    pager: '#table-page',
    sortname: '...',
    viewrecords: true,
    sortorder: 'asc',
    caption: "Records",
    emptyrecords: "Empty records",
    loadonce: false,
    loadComplete: function() {
       ....
    },
    jsonReader: {
       ....
    }
});

当我缓慢滚动网格并达到 200 时，网格会重新加载，但视图显示 2000 年的 View 1-400。

如果我继续缓慢滚动，我会看到 View 1-600 of 2000。

我们还可以在演示中看到 http://www.trirand.com/blog/jqgrid/jqgrid.html -> New in 3.7 -> True Scrolling 并看到相同的错误。

谁能给我建议一个解决方法。

【问题讨论】：

标签： jquery jqgrid

【解决方案1】：

它按设计工作...如果您慢慢滚动，它会将记录添加到表中 - 因此您可以向上滚动并且数据仍然存在 - 如果您快速滚动，当前数据将被删除，并且仅使用添加新数据您在与滚动位置匹配的起点指定的行数

【讨论】：

感谢您的快速回复。我觉得这有点奇怪，但推理似乎是有效的。

【解决方案2】：

您可以根据需要关闭数字，使用 viewrecords 选项：

viewrecords: false

jqGrid documentation 有更多详细信息：

如果为真，jqGrid 显示网格中的开始和结束记录数，在查询中的记录总数中。此信息以以下格式显示在寻呼栏（默认右下角）中：“从 Z 中查看 X 到 Y”。如果这个值为真，还有其他参数可以调整，包括emptyrecords和recordtext。

【讨论】：

如果用户抱怨查看记录，我认为这是一个有效的选择。谢谢。

【解决方案3】：

这是我的代码：删除旧数据但保持滚动位置：

beforeProcessing: function(data, status, xhr){
    // Prevent from loading duplicate data
    var firstId = data.rows[0].id;
    if (-1 != $("#"+firstId ).index()){
        return false;
    }

    // Keep scroll position
    $.scrolltop = $(this).closest(".ui-jqgrid-bdiv").scrollTop();

    // Clear old data -> This will make scroll position to zero
    $(this).jqGrid('clearGridData', true);

    // Show white Div portion
    $(this).parent().children('div').eq(0).show();
},
loadComplete: function (data) {
    // Set height of white Div portion
    $(this).parent().children('div').eq(0).height($.scrolltop);

    // Re-set scroll position
    $(this).closest(".ui-jqgrid-bdiv").scrollTop($.scrolltop);
}

【讨论】：