Php 加载数据表。成功的AJAX请求，但没有可见的数据

如何在dataTable中通过服务器端处理加载json数据

我正在尝试构建一个自定义Wordpress插件，并在数据表中显示来自wpdb的结果。 我得到了一个成功的AJAX返回调用，但是dataTable只显示了一个“处理…”阶段，并且该表没有填充行（保持为空）

虽然我在这里读到了许多（！）类似的问题和答案，但非常感谢使用ajax和json_编码加载数据的任何帮助。 当前代码：

dahsboard.php

<table id="table-id" cellpadding="1" cellspacing="1" width="100%">
    <thead><tr>
        <th>h_id</th>
        <th>h_subject</th>
    </tr></thead>

我认为问题在于下面的数据类型格式：

dashbboard.js

var oTable;
jQuery(document).ready(function() {
    jQuery.fn.dataTable.ext.errMode = 'throw';
    oTable = jQuery('#table-id').DataTable( {
        "serverSide": true,
        "processing": true,
        "columnDefs": [{"defaultContent": "-","targets": "_all"}],
        "columns": [
            { "data": "h_id" } ,
            { "data": "h_subject" }
        ],  

        "ajax":{
            url: "admin-ajax.php?action=my_action",
            type: "post",
            dataSrc:'',
            dataType : "json",
            contentType: "application/json; charset=utf-8",

                //dataSrc: function(data){ return data.data; },
                //async : false,
                //processData: true,
                //accepts: {json: "application/json, text/javascript"},

            success: function(data){
                console.log(JSON.stringify(data)); // successful echo data objects are shown in dashboard.
            },
            error: function(){  
                jQuery("#tablename").append('<tbody class="grid-error"><tr><th colspan="2">No results.</th></tr></tbody>');
                jQuery("#tablename_processing").css("display","none");
            }
        },

    });
}); 

结果ajax成功函数，控制台数据：

{"draw":1,"recordsTotal":3,"recordsFiltered":3,"data":[{"h_id":"37168","h_subject":"6216"},{"h_id":"37169","h_subject":"7021"},{"h_id":"37170","h_subject":"8923"}]}

---

结果仪表板表仅显示：

处理…

删除

dataSrc

和

成功功能

并用数据填充数据表。我非常感谢@bassxzero和@davidkonrad的帮助和努力

确保新版本dashboard.js中有“代表”的答案：

var oTable;
jQuery(document).ready(function() {
jQuery.fn.dataTable.ext.errMode = 'throw';
oTable = jQuery('#table-id').DataTable( {
    "serverSide": true,
    "processing": true,
    "columnDefs": [{"defaultContent": "-","targets": "_all"}],
    "columns": [
        { "data": "h_id" } ,
        { "data": "h_subject" }
    ],  

    "ajax":{
        url: "admin-ajax.php?action=my_action",
        type: "post",
        dataType : "json",
        contentType: "application/json; charset=utf-8",
        error: function(){  
            jQuery("#tablename").append('<tbody class="grid-error"><tr><th colspan="2">No results.</th></tr></tbody>');
            jQuery("#tablename_processing").css("display","none");
        }
    },

});

varotable；
jQuery（文档）.ready（函数（）{
jQuery.fn.dataTable.ext.errMode='throw'；
oTable=jQuery（'#表id'）。数据表（{
“服务器端”：正确，
“处理”：对，
“columnDefs”：[{“defaultContent”：“-”，“targets”：“_all”}]，
“栏目”：[
{“数据”：“h_id”}，
{“数据”：“h_主题”}
],  
“ajax”：{
url：“admin ajax.php？action=my_action”，
类型：“post”，
数据类型：“json”，
contentType:“应用程序/json；字符集=utf-8”，
错误：函数（）{
jQuery（“#tablename”）.append（'No results'）；
jQuery（#tablename_processing”）.css（“display”、“none”）；
}
},
});

---

}))

删除

dataSrc

和

success函数

会产生奇迹，并用数据填充数据表。我非常感谢@bassxzero和@davidkonrad的帮助和努力

确保新版本dashboard.js中有“代表”的答案：

var oTable;
jQuery(document).ready(function() {
jQuery.fn.dataTable.ext.errMode = 'throw';
oTable = jQuery('#table-id').DataTable( {
    "serverSide": true,
    "processing": true,
    "columnDefs": [{"defaultContent": "-","targets": "_all"}],
    "columns": [
        { "data": "h_id" } ,
        { "data": "h_subject" }
    ],  

    "ajax":{
        url: "admin-ajax.php?action=my_action",
        type: "post",
        dataType : "json",
        contentType: "application/json; charset=utf-8",
        error: function(){  
            jQuery("#tablename").append('<tbody class="grid-error"><tr><th colspan="2">No results.</th></tr></tbody>');
            jQuery("#tablename_processing").css("display","none");
        }
    },

});

varotable；
jQuery（文档）.ready（函数（）{
jQuery.fn.dataTable.ext.errMode='throw'；
oTable=jQuery（'#表id'）。数据表（{
“服务器端”：正确，
“处理”：对，
“columnDefs”：[{“defaultContent”：“-”，“targets”：“_all”}]，
“栏目”：[
{“数据”：“h_id”}，
{“数据”：“h_主题”}
],  
“ajax”：{
url：“admin ajax.php？action=my_action”，
类型：“post”，
数据类型：“json”，
contentType:“应用程序/json；字符集=utf-8”，
错误：函数（）{
jQuery（“#tablename”）.append（'No results'）；
jQuery（#tablename_processing”）.css（“display”、“none”）；
}
},
});

---

}))

在ajax-grid-data.php中，将

$json\u data

中的“draw”=>1更改为

“draw”=>$\u GET['draw']

console.log显示$\u GET['draw']返回null。使用intval（$\u GET['draw']），给我“draw”：0，删除

success

选项并将

dataSrc

从空字符串更改为

函数（data）{return data；}

如本例所示@bassxzero已关闭，您不应更改

dataSrc

属性，应将其完全删除。在ajax-grid-data.php中，

$json_data

更改

将“draw”=>1

更改为

“draw”=>$\u GET['draw'.

console.log向我显示$\u GET['draw']返回null。使用intval（$_GET['draw']），给我“draw”：0，删除

success

选项，并将

dataSrc

从空字符串更改为

函数（data）{return data；}

如本例所示@bassxzero已关闭，不应更改

dataSrc

属性，应将其完全删除。

var oTable;
jQuery(document).ready(function() {
jQuery.fn.dataTable.ext.errMode = 'throw';
oTable = jQuery('#table-id').DataTable( {
    "serverSide": true,
    "processing": true,
    "columnDefs": [{"defaultContent": "-","targets": "_all"}],
    "columns": [
        { "data": "h_id" } ,
        { "data": "h_subject" }
    ],  

    "ajax":{
        url: "admin-ajax.php?action=my_action",
        type: "post",
        dataType : "json",
        contentType: "application/json; charset=utf-8",
        error: function(){  
            jQuery("#tablename").append('<tbody class="grid-error"><tr><th colspan="2">No results.</th></tr></tbody>');
            jQuery("#tablename_processing").css("display","none");
        }
    },

});