如何在删除一行后刷新jquery数据表

删除按钮的点击，我打电话这段代码：

$('.deleteButton').live('click', function() { 

      var $this = $(this); 
      var url = $this.attr("id"); 
      $("#example").fnReloadAjax(); 
      $.getJSON(url, Success()); 
     });

的网址是取Id和从数据库中删除数据的控制器的作用。这样可行。我现在想调用datatable的refresh/redraw函数，以便它可以加载新的结果，但它不起作用。

数据表是：

$("#example").dataTable({ 
      "aoColumns": [ 
        { "sTitle": "Id" }, 
         { "sTitle": "Name" }], 


      "bProcessing": true, 
      "bServerSide": true, 

      "sAjaxSource": '@Url.Action("FetchData", "Home")', 
      "sPaginationType": "full_numbers", 

});

任何人都可以请指教？

来源

2011-12-27 InfoLearner

从API datatable page引用 - 在fnReloadAjax()子弹：

注意：要使用服务器端处理时重新加载数据，只需使用内置的API函数fnDraw而不是此插件。

因此，你最好使用fnDraw。

[编辑]其实，您的通话顺序应该是：

// you don't have to use $.json because you don't use the downloaded data 
// first, ask the server to delete the data 
$.ajax({ 
    url: urlToDelete, 
    success: function() { 
     // if it worked, ask datatable to redraw the table with the new data 
     $("#example").dataTable().fnDraw(); 
     // if this js function does anything useful (like deleting the row), then call it: 
     Success(); 
    }, 
    error: function() { 
     // display any error (like server couldn't be reached...), or at least try to log it 
    } 
});

来源

2011-12-27 20:18:47 JMax

行我要调用服务器端删除功能。有没有更好的方法来调用这个动作？ – InfoLearner 2011-12-27 20:25:03

然后，你应该在*要求重绘之前调用它*。我将编辑我的答案更清晰 – JMax 2011-12-27 20:28:05

像以前一样，它可以进入成功功能，但它不会刷新数据表？ – InfoLearner 2011-12-27 20:39:48

答案在这里并没有为我工作，所以我用这个：

http://datatables.net/plug-ins/api#fnReloadAjax

添加此到一个文件：

$.fn.dataTableExt.oApi.fnReloadAjax = function (oSettings, sNewSource, fnCallback, bStandingRedraw) 
{ 
    if (sNewSource !== undefined && sNewSource !== null) { 
     oSettings.sAjaxSource = sNewSource; 
    } 

    // Server-side processing should just call fnDraw 
    if (oSettings.oFeatures.bServerSide) { 
     this.fnDraw(); 
     return; 
    } 

    this.oApi._fnProcessingDisplay(oSettings, true); 
    var that = this; 
    var iStart = oSettings._iDisplayStart; 
    var aData = []; 

    this.oApi._fnServerParams(oSettings, aData); 

    oSettings.fnServerData.call(oSettings.oInstance, oSettings.sAjaxSource, aData, function(json) { 
     /* Clear the old information from the table */ 
     that.oApi._fnClearTable(oSettings); 

     /* Got the data - add it to the table */ 
     var aData = (oSettings.sAjaxDataProp !== "") ? 
      that.oApi._fnGetObjectDataFn(oSettings.sAjaxDataProp)(json) : json; 

     for (var i=0 ; i<aData.length ; i++) 
     { 
      that.oApi._fnAddData(oSettings, aData[i]); 
     } 

     oSettings.aiDisplay = oSettings.aiDisplayMaster.slice(); 

     that.fnDraw(); 

     if (bStandingRedraw === true) 
     { 
      oSettings._iDisplayStart = iStart; 
      that.oApi._fnCalculateEnd(oSettings); 
      that.fnDraw(false); 
     } 

     that.oApi._fnProcessingDisplay(oSettings, false); 

     /* Callback user function - for event handlers etc */ 
     if (typeof fnCallback == 'function' && fnCallback !== null) 
     { 
      fnCallback(oSettings); 
     } 
    }, oSettings); 
};

将文件包含在您的页面上，并调用像这个：

// Example call to load a new file 
oTable.fnReloadAjax('media/examples_support/json_source2.txt'); 

// Example call to reload from original file 
oTable.fnReloadAjax();

来源

2013-10-19 15:24:29 user1477388

我能够解决这个问题比上面的答案提供了一个简单的方法。

Ajax调用从后端数据删除所有的

首先使用正常的AJAX异步调用从后端删除数据。

从前端数据表

删除获取要删除，并使用数据表功能fnDeleteRow删除这行的行TR。这会自动刷新表格，所以你不需要任何fnDraw或其他东西。

//in my case its delete button which was clicked 
//so I got its parents parent which is TR row 
var row = $(this).parent().parent(); 


$('DATA TABLE SELECTOR').dataTable().fnDeleteRow(row);

和你做.. :-) DataTable的

来源

2015-07-23 07:19:34 hhsadiq

最好的一个...为我工作 – MKD 2015-09-16 12:43:20

使用实例，并删除数据表

dataTable.fnDeleteRow($(that).closest('tr').remove()); 
dataTable.fnDraw();

来源

2016-06-20 11:09:48

如何在删除一行后刷新jquery数据表

回答

相关问题