获取 ajax 内容的表上的数据表答案

【问题标题】：Datatable on table getting ajax content获取 ajax 内容的表上的数据表
【发布时间】：2018-07-25 12:55:20
【问题描述】：

我想在通过 ajax 请求获取其内容的表上使用 DataTable。

基本上，在使用 jQuery 进行 ajax 请求后，我有一个 php 文件响应表格内容（使用 thead、tbody 和 tfoot 元素）。

main.js 喜欢：

$.ajax({
    type: 'GET', 
    url: 'table.php', 
    data: 'dateStart='+$("#dateStart").val(), 
    dataType: 'html', 
    success: function(response){
        $("table#myTable").html(response);
    }
});

$("table#myTable").DataTable();

table.php 喜欢：

some code ...
echo $reponse;

jQuery 和 DataTable.js 和 DataTable.css 依赖项在 http://datatables.net 上指定

但它不起作用...我正在使用 Chrome 并且控制台显示：

未捕获的类型错误：无法读取未定义的属性“aDataSort”

【问题讨论】：

您的代码中有一些错误。这可能是它不起作用的原因。查看 ajax type 和 url 参数
顺便说一句，在我的代码中没有这样的错误。但谢谢你，我已经编辑了它们。我写的太快了：/
好的，还有一个问题。你能确认你的文件table.php 被ajax 调用了吗？也许网址应该是'/table.php'？ aDataSort 是什么？是你的变量吗？
我不知道什么是 aDataSort 但我可以说它不是我的变量。我确认我的文件 table.php 是由 ajax 调用的，这个调用在我获取表格内容时有效。
您是否尝试禁用 SORTING ..？像这样 -> (stackoverflow.com/questions/30348028/…)

标签： javascript jquery ajax datatables

【解决方案1】：

你必须在ajax调用结束后调用datatable：

$.ajax({
    type: 'GET', 
    url: 'table.php', 
    data: 'dateStart='+$("#dateStart").val(), 
    dataType: 'html', 
    success: function(response){
        $("table#myTable").html(response);
        $("table#myTable").DataTable();

    }
});

【讨论】：

非常感谢！有用。当我想到它时，我发现您的解决方案非常合乎逻辑。事实上，我的桌子最初是空的。 Ajax 请求允许给它一些数据。但是，如果我在表格为空之前调用 DataTable，它将无法正常工作。