JQuery DataTable删除行后的页面更新利用Ajax解决

发布时间：2020-12-14 23:29:17 所属栏目：资源来源：网络整理

导读：使用Jquery的DataTable进行数据表处理非常方便，常遇到的一个问题就是删除一行后页面必须进行更新，需要注意的方法如下：前台页面中初始化table时注意：复制代码代码如下: var table = $('#sorting-advanced'); table.dataTable({ 'bServerSide': true, 'sA

使用Jquery的DataTable进行数据表处理非常方便，常遇到的一个问题就是删除一行后页面必须进行更新，需要注意的方法如下：前台页面中初始化table时注意：

复制代码代码如下:

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

'bStateSave': true,这个必须设置，这样就可以在删除返回时，保留在同一页上'bStateSave': true,这个必须设置，这样就可以在删除返回时，保留在同一页上
删除的代码如下：

复制代码代码如下:

 
function deleteConfirm(deleteID) 
{ 
$.modal.confirm('确实要删除此用户吗?',function() 
{ 
$.ajax('servlet/DeleteUser',{ 
dataType : 'json',
data: { 
userID: deleteID 
},
success: function(data) 
{ 
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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!