如何在jquery DataTable中保持活动页面

Question

我在jquery dataTable上列出了几个数据，并通过DataTable插件默认完成了分页。我希望在处理数据时获取dataTable的当前页面，并在处理操作并将数据重新加载后将该页面设置为活动状态。

Answer 1

看到这个小提琴。您可以看到如何获取当前页面。在JSFiddle中，您可以尝试刷新浏览器。例如，当前页面现在是3.当您刷新浏览器时，您仍然在第3页。

要解决您的问题，想要在编辑或删除行时返回到最后一页，您必须使用此选项使jquery数据表记住最后一页的位置。 Jquery Datatable将保存表的状态（其分页位置，排序状态等）。状态保存方法使用HTML5 localStorage和sessionStorage API来有效存储数据。请参阅此链接以阅读有关它的更多详细信息。 State saving

"bStateSave": true

JSFiddle链接

Fiddle Demo

Javascript代码

$(document).ready(function() {
    var table = $('#example').DataTable({
        "sPaginationType": "full_numbers",
        "bStateSave": true
    });

    $("#example").on('page.dt', function () {
    var info = table.page.info();
        $('#pageInfo').html('Currently showing page ' + (info.page + 1) + ' of ' + info.pages + ' pages.');
    });
} );

Answer 2

仅使用stateSave：true

像这样：

$(document).ready(function() {
    $('#tableId').DataTable( {
        stateSave: true
    } );
})

Answer 3

请参阅dataTables文档，该文档提供了一个回调函数，您可以从中获取当前页面：

$('#example').dataTable( {
  "drawCallback": function( settings ) {
       var api = new $.fn.dataTable( settings );

        // Output the data for the visible rows to the browser's console
        // You might do something more useful with it!
        console.log( api.rows( {page:'current'} ).data() );
    }
});

Answer 4

在初始化数据表的位置添加此项

"drawCallback": function( settings ) {
      alert ( 'You are on ssame page' );
}

这个对我有用 ：）

Answer 5

从Datatable复制

var table = $('#example').DataTable( {
    ajax: "data.json"
} );

setInterval( function () {
    table.ajax.reload( null, false ); // user paging is not reset on reload
}, 30000 );

在重新加载函数时传递null，false以在重新加载表时保留在该页面上。有关更多信息，请参阅ajax.reload()文档。