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

时间:2015-04-13 06:32:32

标签: javascript jquery datatables jquery-datatables

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

4 个答案:

答案 0 :(得分:5)

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

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

"bStateSave": true

JSFiddle Link

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.');
    });
} );

答案 1 :(得分:2)

仅使用 stateSave:true

像这样:

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

答案 2 :(得分:1)

请参阅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() );
    }
});

答案 3 :(得分:0)

从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()文档。