表更新后刷新dataTable答案

【问题标题】：refresh dataTable after table update表更新后刷新dataTable
【发布时间】：2016-04-21 10:07:22
【问题描述】：

我有一个html表格tabDevis：

<table id="tabDevis" class="invisible stripe">
    <thead>
        <tr>
            <th>numDevis</th>
            <th>libProduit</th>
            <th>codEtat</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

我用 ajax 调用放了一些数据。这些数据来自数据库。代码在函数内部：

function putDevis() {
  var listeDevis = $("#tabDevis").find("tbody");

  var request = $.ajax({
    type : "GET",
    url : "/services/opp/getDevis/",
    cache : false
  });

  request.done(function(msg) {
    for (var i = 0; i < msg.length; i++) {
        var devis = msg[i];
        var tr = $("#template").clone();
        tr.removeAttr("id");
        tr.attr('id', 'devis-' + devis.id);
        tr.find('#numDevis').html(devis.idOpportunite);
        tr.find("#codProduit").html(devis.codProduit);
        tr.find("#libProduit").html(devis.libProduit);

        listeDevis.append(tr);
    }
  }

  request.fail(function(jqXHR, textStatus, errorThrown) {
    // Deal with the error
  }

  // Call dataTable
  $('#tabDevis').DataTable({
    "order" : [ [ 1, "desc" ] ],
    "oLanguage" : {
         ...
    }
    "aoColumns" : [ {
            "bSortable" : true
        }, {
            "bSortable" : true
        }, {
            "bSortable" : true
    }]
  }
}

我从另一种方式删除了我的数据库中的一行，所以我想重新加载 html 表。我调用了我的putDevis() 函数，但我仍然得到从数据库中删除的已删除行。

这个删除操作是通过另一个 javasript 函数完成的：

function deleteDevis(numDevis){

  var requestsup = $.ajax({type: "GET",
        url: "/services/ep/deleteDevis?pId=" + numDevis
        cache: false
  });

  requestsup.done(function(msg){
    putDevis();
  });

  requestsup.fail(function(jqXHR, textStatus, errorThrown) {
    // Deal with errors
  });
}

dataTable的刷新方式是什么？

我尝试在调用 putDevis()` 之前调用 $('#tabDevis').dataTable().fnDestroy();，但它不起作用。

编辑解决方案

方法就是销毁那里的dataTable：

var table = $('#tabDevis').DataTable(); 
table.destroy();
var listeDevis = $("#tabDevis").find("tbody");

然后在dataTable调用后绘制：

var table = $('#tabDevis').DataTable(); 
table.draw();

【问题讨论】：

$('#tabDevisClient') 这不是使用与您用于初始化数据表的元素 ID 不同的元素 ID $('#tabDevis') ?您的 HTML 页面上是否存在 ID 为 #tabDevisClient 的元素？
编辑问题，tabDevis 在这两种情况下都很好

标签： jquery ajax datatable

【解决方案1】：

你可以使用这样的东西：

var refreshinterval = 30000;
setInterval(putDevis, refreshinterval);

【讨论】：

当用户从数据库中删除一行时我需要刷新（这是通过另一个 ajax 调用完成的）
当另一个 ajax 调用发生时？在什么活动上？

【解决方案2】：

尝试清理表格并重新绘制它。

请参阅此链接以供参考。

https://datatables.net/reference/api/clear()

【讨论】：

我试过 $('#tabDevis').dataTable().clear(); 并显示一个错误，因为无法在此对象上调用 clear。