动态追加DataTable而不刷新页面

Posted 2023-05-07

【中文标题】动态追加DataTable而不刷新页面

【英文标题】：Append DataTable dynamically without refresh page

【发布时间】：2020-06-25 11:53:43

【问题描述】：

我需要动态附加一个 DataTable，我需要多次填写一个表单并在每次用户单击按钮以发送其输入结果并在我的 Datatable 中显示结果时在 DT 中显示结果。

 <table id="table" class="display" ></table>
 <button type="button" id="btnOne" class="btn btn-success"> Valider</button>

 <script>
 $("#btnOne").click(function() 
     var reje = $("#table")

    reje.DataTable (
        "data" : maj_ref_modeles_json,
        "columns" : [
             "data" : "codemodele" ,
              "data" : "pksegmentation" 

        ]
    );
 );
 </script>

第一组数据的数据表已正确填充，但在第二次迭代时，我的浏览器中有此消息：

DataTables 警告：table id=table - 无法重新初始化 DataTable。有关此错误的更多信息，请参阅http://datatables.net/tn/3

【问题讨论】：

你已经看到了吗？ ***.com/questions/13708781/…

【参考方案1】：

在创建新数据表之前销毁数据表

$("#table").dataTable().fnDestroy();

【讨论】：

这不会也删除以前的数据吗？ ，根据我从“我需要动态附加 DataTable”的解释，OP 希望继续将数据附加到表中

我已经使用了这个并且得到了一个错误：jquery.dataTables.min.js:79 Uncaught TypeError: Cannot read property 'aDataSort' of undefined

那么问题出在你的 tbody 你需要使用 $(#table tbody).empty(); 清空 tbody;试试这个

同样的问题，无法重新初始化DataTable