dataTable進行操作後刷新頁面會自動跳轉到首頁,增加保存當前頁碼,跳轉至當前頁
$('#materialSelected, #materialSelected2').on('click', 'a.down', function (e) {
e.preventDefault();
var newDataInTable = [];
// 獲取當前表格的所有數據
var dataInTable = $(this).closest("table").DataTable().data();
// 獲取當前選中的數據的位置
var $table = $(this).closest("table");
var table = $table.DataTable();
var index = table.row($(this).parents('tr')).index();
var pageIndex = table.page(); // 獲取當前頁碼數
// 交換兩個數據的位置
var position = index + 1;
if (position > -1 && position <= dataInTable.length - 1) {
newDataInTable = swapArray(dataInTable, index, position);
// 刷新表格
if ($table.attr("id") == "materialSelected") {
dataSelected = newDataInTable;
freshDataTableForMove(newDataInTable);
$("#materialSelected").DataTable().page(pageIndex).draw(false); // 跳轉到當前頁數
} else {
dataSelected2 = newDataInTable;
freshDataTable2(newDataInTable);
$("#materialSelected2").DataTable().page(pageIndex).draw(false); // 跳轉到當前頁數
}
} else {
layer.msg("最底元素無法下移!", { time: 1000, icon: 7 });
}
});
實際上主要是兩行代碼
這裏是進行上升下降,數據不變,只是改變排序的情況,還有一種刪除了數據,數據變換的情況,如果表格剛好刪除最後一列唯一的數據,最後一頁無數據了,需要跳轉到前一頁,加個判斷
// 初始化刪除按鈕
$('#materialSelected, #materialSelected2').on('click', '.del', function (e) {
e.preventDefault();
var id_key = $(this).data("idkey");
var $table = $(this).closest("table");
var table = $table.DataTable();
var index = table.row($(this).parents('tr')).index();
var pageIndex = table.page(); // 獲取頁碼數
// selected.deleteRow($(this).data("id"));
// selected.loadData();
if ($table.attr("id") == "materialSelected") {
for (var i = 0; i < dataSelected.length; i++) {
var obj = dataSelected[i];
if (id_key == obj.id_key) {
dataSelected.splice($.inArray(obj, dataSelected), 1);
names.splice($.inArray(obj.subject_name, names), 1);
}
}
for (var i = 0; i < dataSearch.length; i++) {
var obj = dataSearch[i];
if (id_key == obj.id_key) {
dataSearch.splice($.inArray(obj, dataSearch), 1);
}
}
selected.row(index).remove().draw(false);
if (selected.data().length == 0) {
$("#materialSelected .l-bar-btnprev").trigger("click");
}
$('#mytable').dataTable().fnDraw(false);
// 刷新表格
freshDataTableForMove(dataSelected);
// 判斷是否是最後一頁且刪除了最後一個數據,如果是則跳轉至前一頁
if(dataSelected.length % 10 == 0 && pageIndex == (dataSelected.length / 10)){
pageIndex = pageIndex - 1;
}
$("#materialSelected").DataTable().page(pageIndex).draw(false); // 跳轉到指定頁數
} else {
for (var i = 0; i < dataSelected2.length; i++) {
var obj = dataSelected2[i];
if (id_key == obj.id_key) {
dataSelected2.splice($.inArray(obj, dataSelected2), 1);
names2.splice($.inArray(obj.subject_name, names2), 1);
}
}
for (var i = 0; i < dataSearch2.length; i++) {
var obj = dataSearch2[i];
if (id_key == obj.id_key) {
dataSearch2.splice($.inArray(obj, dataSearch2), 1);
}
}
selected2.row(index).remove().draw(true);
if (selected2.data().length == 0) {
$("#materialSelected2 .l-bar-btnprev").trigger("click");
}
$('#mytableT').dataTable().fnDraw(false);
// 刷新表格
freshDataTable2(dataSelected2);
// 判斷是否是最後一頁且刪除了最後一個數據,如果是則跳轉至前一頁
if(dataSelected2.length % 10 == 0 && pageIndex == (dataSelected2.length / 10)){
pageIndex = pageIndex - 1;
}
$("#materialSelected2").DataTable().page(pageIndex).draw(false); // 跳轉到指定頁數
}
});
newDataInTable 和dataSelected 都是dataTable的數據