当前位置:编程学习 > JAVA >>

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

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

[javascript]  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; 
            } 
        }); 

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, 这个必须设置,这样就可以在删除返回时,保留在同一页上

删除的代码如下:

[javascript]  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('服务器无响应,请联系管理员!'); 
                        } 
      }); 
            

补充:web前端 , JavaScript ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,