jQuery datatables Twitter/Facebook风格的传呼

我一直在寻找一个很好的资源如何做到这一点，没有运气。我正在使用jQuery数据表插件以及启用流水线的服务器处理插件（example）。我有这个工作在我的asp.net webforms项目，并将转移到未来项目的MVC。我正在照顾服务器端处理与类找到Here。我也一直在寻找与分页有关的文章Here。jQuery datatables Twitter/Facebook风格的传呼

基本上我需要做的是创建这种类型与数据表插件与服务器端处理分页的（流水线是不是在这里一定很重要）

注：由Twitter /风格传呼我指的是无论是到：

在该带回在表附加到现有的内容的附加结果
附加结果无限加载作为用户表中的底部的单个按钮通过滚动到达当前结果的结尾（注意：我发现这个功能是内置在数据表插件中的，所以我需要关注以前的方法）。

最终我想在上面两种分页样式之间进行选择。

有没有人有任何好的建议和/或样品/教程分享？

来源

2011-01-22 stephen776

这有没有想通？两年后我有同样的问题。 – 2013-05-31 22:08:55

我开发了PageLoadMore插件，允许用“加载更多”按钮替换默认分页控件。

加载jQuery和jQuery DataTables文件后包含插件的JavaScript文件。
在表格后面添加ID为btn-example-load-more的“加载更多”按钮。

使用下面的代码初始化表：

$(document).ready(function(){ 
    var table = $('#example').DataTable({ 
     dom: 'frt', 
     ajax: 'https://api.myjson.com/bins/qgcu', 
     drawCallback: function(){ 
     // If there is some more data 
     if($('#btn-example-load-more').is(':visible')){ 
      // Scroll to the "Load more" button 
      $('html, body').animate({ 
       scrollTop: $('#btn-example-load-more').offset().top 
      }, 1000); 
     } 

     // Show or hide "Load more" button based on whether there is more data available 
     $('#btn-example-load-more').toggle(this.api().page.hasMore()); 
     }  
    }); 

    // Handle click on "Load more" button 
    $('#btn-example-load-more').on('click', function(){ 
     // Load more data 
     table.page.loadMore(); 
    }); 
});

代码和演示见this example。

有关更多示例和详细信息，请参见jQuery DataTables: "Load more" button。

来源

2017-07-31 14:30:52

jQuery datatables Twitter/Facebook风格的传呼

回答

相关问题