javascript - 如何从数据表滚动扩展中获取显示行？

Question

使用 Scroller 时数据表的扩展，您没有分页，但所有行都在一个滚动条中。我想知道，向下滚动表格后会触发什么事件，例如请参阅 100 行中的第 50-60 行。我还需要知道如何从数据表中获取这 10 行。我正在使用最新版本。非常感谢。

这是从 Datatable.net 中的当前页面获取行的方法，无需 Scroller延伸。

drawCallback: function (settings) {
    var api = new $.fn.dataTable.Api(settings);

    // Output the data for the visible rows to the browser's console
    console.log(api.rows({ page: 'current' }).data().length);
}

Update 1: My Init of Scroller table:

initScrollerTable = function ($table, url, inclFilter, dataTableOptionsSpecific) {
    $.ajax({
        method: "POST",
        url: url,
        data: dataParameterHelper.getCommonData(),
        dataType: "json"
    })
    .done(function (rows) {
        var dataTableOptions = $.extend(
            {},
            { data: rows },
            dataTableOptionsSpecific
        );

        initTable($table, inclFilter, dataTableOptions);
    });
};

Update 2 Deeper elaborating on the origional reason for the question to clarify.

好吧，长话短说。我的表包含 26000 行，我花了 7 分钟才加载它。它包含大量数据库调用，并且 JSON 大小为 21MB!我想优化它。 第一次尝试:我将 json 降至绝对最小值，将其降至 1.5MB，但仍然花费了近 7 分钟。在第二次测试中，它包含所有 html，带有硬编码的数字/字符串，我执行了 0 次数据库调用。仅用了 3.5 秒!。昨天我不知道我只需要专注于优化对数据库的调用。 昨天，当我发布原始查询时，我的想法是填充表而不从数据库中提取任何数据，而是以一种延迟加载的方式加载它们。假设我显示了前 10 行。每列有 3 列，我需要为每个单元格调用数据库，总共 30 次。因此，我们的想法是对 (10) 个当前行发出 30 个请求，并将占位符替换为实际值。如果你明白的话。我仍然会比 26.000 * 3 DB 调用更好:) 为此，我需要连接一个事件来获取 10 个当前行 ID，然后我可以循环发出 30 个 AJAX 请求。所以也许这就是我需要的滚动事件，如果有这样的人的话。 但我不知道这是否是一个好主意。通常，“好”想法只是在您学习最佳实践之前/之前才“好”:) 我想我将开始专注于通过一些内部联接来减少数据库调用，检索一个大结果集，我可以在 15 秒内循环并填充所有 26.000(以及后来的 50.000)行!

Answer 1

SOLUTION

使用xhr处理 Ajax 请求的事件和 page.info()检索有关表的信息，如下所示。

请注意，在初始化表以处理初始 Ajax 请求之前，需要附加事件处理程序。

$('#example').on('xhr.dt', function ( e, settings, json, xhr ) {
    var api = new $.fn.dataTable.Api(settings);
    var info = api.page.info();

    console.log('Data has been loaded', info);
});

DEMO

参见this jsFiddle用于代码和演示。