【问题标题】:DataTables Infinite Scroll in 1.101.10 中的 DataTables 无限滚动
【发布时间】:2017-04-08 22:22:24
【问题描述】:

在将 DataTables 更新到 1.10 后,bScrollInfinite 被新扩展 Scroller 取代。问题是 Scroller 正在使用表格 div 中的虚拟滚动条。我想通过主浏览器滚动条创建简单的(我知道,无限滚动有很多麻烦)无限滚动。

目前,我有类似的东西:

var dataTable = $('#data-table').DataTable({
    serverSide: true,
    pageLength: 100,
    searching: true,
    fixedHeader: {
        header: true,
        headerOffset: 50
    },
    ajax: {
        url: '/url',
        method: 'POST'
    },
    columns: [ 'col1', 'col2' ],
});

$(window).scroll(function() {
    if ($(window).scrollTop() + $(window).height() == $(document).height()) {
        console.log("bottom!");
        dataTable.page('next').draw('page');
    }
});

这工作正常,但它用新行替换现有行(来自新页面)。我已经尝试了 Ajax 调用和 rows().add(...).draw() 方法的 success 回调,但是在触发 draw() 之后,我得到了无限循环(因为 draw 调用 Ajax) 而不是无限滚动:(

基本上,我需要在表格末尾添加新行,而不是替换现有行。

顺便说一句,类似的问题是posted to DataTables forum,但没有有用的答案。

【问题讨论】:

  • 有同样的问题,有消息吗?

标签: jquery datatables datatables-1.10


【解决方案1】:
table.datatable({      
      iDisplayLength: 25,
      serverSide: true,
      ordering: false,
      searching: false,
      sAjaxSource: //url here,
      scrollY: 1014 //can be any value,
      scroller: {
        loadingIndicator: true
      }
}

这是可行的,但您应该记住一件事,包括滚动插件。它不是 jquery.datatables.js 的一部分

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-22
    相关资源
    最近更新 更多