首頁 >web前端 >js教程 >JQuery DataTable刪除行後的頁面更新利用Ajax解決_jquery

JQuery DataTable刪除行後的頁面更新利用Ajax解決_jquery

WBOY
WBOY原創
2016-05-16 17:33:381402瀏覽

使用Jquery的DataTable進行資料表處理非常方便,常遇到的一個問題就是刪除一行後頁面必須進行更新,需要注意的方法如下:前台頁面中初始化table時注意:

複製程式碼 程式碼如下:

var table = $('#sorting-advanced');
table.dataTable({
'bServerSide': true,
'sAjaxSource': 'servlet/UserList',
'bProcessing': true, 'bStateSave': true,
'ao [ColumnDefs': [ColumnDefs': [ColumnDefs': [ColumnDefs': [ColumnDefs': [ColumnDefs':
{ 'bSortable': false, 'aTargets': [0,1,6]}
],
'sPaginationType': 'full_numbers',
'sDom': 't',
'fnInitComplete': function( oSettings )
{
// Style length select
table.closest('.dataTables_wrapper').find( .dataTables_length select').addClass('select blue-gradient glossy').styleSelect();
tableStyled = true;
}
});

}
});
'bStateS' : true, 這個必須設置,這樣就可以在刪除返回時,保留在同一頁上'bStateSave': true, 這個必須設置,這樣就可以在刪除返回時,保留在同一頁上
刪除的程式碼如下
複製程式碼


程式碼如下:

function deletef)
{
$.modal.confirm('確實要刪除此使用者嗎?', function()
{
$.ajax('servlet/DeleteUser', {
dataType : ' json',
data: {
userID: deleteID
},
success: function(data)
{
if (data.success =='true')
{
if (data.success =='true')
{
$.modal.alert('刪除成功!');
start = $("#sorting-advanced").dataTable().fnSettings()._iDisplayStart;
total = $(" #sorting-advanced").dataTable().fnSettings().fnRecordsDisplay();
window.location.reload();
if((total-start)==1){
if ( start > 0) {
$("#sorting-advanced").dataTable().fnPageChange( 'previous', true );
}
}
}
else
{
$.modal.alert('刪除發生錯誤,請聯絡管理員!');
}
},
error: function()
{
$.modal .alert('伺服器無回應,請聯絡管理員!');
}
});

}, function()
{
//$.modal. alert('Meh.');
});
}; 其中只要是需要判斷一下當前頁中是否有數據,如果是最後一條的話,就在刪除後呼叫$("#sorting-advanced").dataTable().fnPageChange( 'previous', true );已回到上一頁注意$("#sorting-advanced").dataTable ().fnPageChange( 'previous'); 是不行的,必需進行刷新,否則頁面中顯示的iDisplayStart會從cookie中取得,還是刪除前的iDisplayStart
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn