JQuery DataTable 删除行后的页面更新解决办法（Ajax）

来源：互联网发布：18年网络教育改革编辑：程序博客网时间：2024/06/08 02:59

使用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 selecttable.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