数据表重新加载更改事件 [英] Datatables reload on change event

问题描述

我有一个html下拉，最初填充并显示数据表。数据来自一个json数组。一旦下拉改变了，我得到了重新初始化错误，修复了它。

我已经尝试过table.ajax.reload和table.fnReloadAjax （）;我使用的数据表与它们不是最好的。

这里是代码：

  function Population（）{
 var table = $（'＃Population'）。dataTable（）; 
 
 $（＃quickStats）。change（function（）{
 
 var optionValue = $（＃quickStats）。val（）; 
控制台.log（optionValue）; 
 
 if（optionValue == 1）{
 $（＃display）。append（'< table cellpadding =0cellspacing =0 border =0class =displayid =Population>'+ 
'< thead>< tr> 人口统计学< th>< / th> < / thead>'
 +'< / table>'）; 
 
 
 $（'＃Population'）。dataTable（{
data ：usPopulation，
bJQueryUI：true，
columns：[
 {data：Demographic}，
 {data：Total} 
 
]，
}）; 
} 
 table.ajax.reload（）; 
 
}）; 
} 
  

解决方案

尝试摧毁前一个创建新的：

  $（'＃人口）。dataTable（）。fnDestroy（） 
 
 
 $（'＃人口）dataTable（{
data：usPopulation，
bJQueryUI：true，
columns ：[
 {data：Demographic}，
 {data：Total} 
 
]，
}）; 
  

或这样做：

  var table = $（'＃Population'）dataTable（{
data：usPopulation，
bJQueryUI：true，
columns [
 {data：Demographic}，
 {data：Total} 
 
]，
}）; 
 
 table.draw（）; 
  

I have a html drop down that initially populates and shows the data table. The data is coming from a json array. Once the drop down is changed i'm getting the reinitialise error and having trouble fixing it.

I've tried the table.ajax.reload and also the table.fnReloadAjax(); I work with datatables off an on so not the greatest with them.

Here is the code:

function Population() {
var table = $('#Population').dataTable();

$("#quickStats").change(function () {

    var optionValue = $("#quickStats").val();
    console.log(optionValue);

    if (optionValue == 1) {
        $("#display").append('<table cellpadding="0" cellspacing="0" border="0" class="display" id="Population">' +            
        '<thead><tr><th>Demographic</th><th>Total</th></thead>'
         + '</table>');


    $('#Population').dataTable({
        "data": usPopulation,
        "bJQueryUI":true,
        "columns": [
            { "data": "Demographic" },
            { "data": "Total" }

        ],
    });
}
    table.ajax.reload();

});
}

解决方案

Try destroying the previous one before creating new:

$('#Population').dataTable().fnDestroy();


 $('#Population').dataTable({
        "data": usPopulation,
        "bJQueryUI":true,
        "columns": [
            { "data": "Demographic" },
            { "data": "Total" }

        ],
    });

or do like this:

var table = $('#Population').dataTable({
            "data": usPopulation,
            "bJQueryUI":true,
            "columns": [
                { "data": "Demographic" },
                { "data": "Total" }

            ],
        });

table.draw();

这篇关于数据表重新加载更改事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！