如何在使用jquery/datatables排序后保留当前页面?

uinbv5nw  于 2022-11-03  发布在  jQuery
关注(0)|答案(5)|浏览(150)

我使用的是http://www.datatables.net版本1.9.4。排序后我想保留当前页面,但默认行为会将我重定向到第一页。有人知道快速解决方案吗?
谢谢

7uzetpgm

7uzetpgm1#

有一个状态保存选项。请参见this link

$(document).ready(function() {
    $('#example').dataTable( {
        stateSave: true
    } );
} );
i2byvkas

i2byvkas2#

使用"bStateSave": true代替Pexsol提到的stateSave: true

tp5buhyn

tp5buhyn3#

stateSave选项不会解决这个问题,因为它只处理页面刷新,而不处理排序更改。

var page = 0;

var table = $('#example').DataTable();

table.on('order', function() {
    if (table.page() !== page) {
        table.page(page).draw('page');
    }
});

table.on('page', function() {
    page = table.page();
});

参见小提琴here

ulydmbyx

ulydmbyx4#

我知道我迟到了,但我最近遇到了同样的问题,也许我的解决方案可能会对某人有所帮助。
DataTable不提供此功能,因为排序后所有数据都将被排序,因此您将被重定向到第一页,因为可见数据将不重要。但由于客户端的要求,我不得不仅对可见数据执行排序。
首先,您需要禁用表的表头单击事件

var table = $('#example').DataTable();
table.columns().every( function () {
        var cell = $(this.header());
        cell.off( 'click');    
    });

然后向要排序的每个列添加一个click事件,并调用以列索引为参数的自定义sortTable(n)

<th onclick="sortTable(0)">First Name</th>
<th onclick="sortTable(1)">Last Name</th>

function sortTable(n) {
    if (dir == "asc") {
        table.order([[ n , 'asc' ]].draw(false);
        dir = "desc";
    }
    else if (dir == "desc") {
        table.order([[ n , 'desc' ]].draw(false);
        dir = "asc";
    }
}

您还需要全局初始化dir变量,并将其设置为默认方向asc/desc

fbcarpbf

fbcarpbf5#

我使用这个J-Query停留在页面上。

[Code]

 function refreshPage() {
 var page_y = document.getElementsByTagName("body")[0].scrollTop;
 window.location.href = window.location.href.split('?')[0] + '?page_y=' + 
  page_y;
 }
 window.onload = function () {
 setTimeout(refreshPage, 350000);
 if (window.location.href.indexOf('page_y') != -1) {
    var match = window.location.href.split('?')[1].split("&") 
    [0].split("=");
    document.getElementsByTagName("body")[0].scrollTop = match[1];
  }
 }

       [/Code]

相关问题