如何使用 json 字符串填充数据表？答案

【问题标题】：How to populate data tables with the json string?如何使用 json 字符串填充数据表？
【发布时间】：2014-09-12 13:35:06
【问题描述】：

如果我使用sAjaxSource = "filepath/file"，我会成功填充数据表

但是，如果我传递 PHP json 数据并尝试收集它，它不会填充数据表中的数据，

如何直接使用json数据而不调用objects.txt文件中的数据。 ?

json_data  = { "aaData": [
    {
        "Rendering_engine": "Trident",
        "Browser": "Internet Explorer 4.0",
        "Platforms": "Win 95+",
        "Engine_Version": "4",
        "CSS_Grade": " b"

    },
    {
        "Rendering_engine": "rident",
        "Browser": "Internet Explorer 5.0",
        "Platforms": "Win 95+",
        "Engine_Version": "5",
        "CSS_Grade": " a"

    }
] }

php 代码

$r = //sql query    
$ma['aaData'] =$r;
                        $data = json_encode($ma);
                        var_dump($data);

脚本

    <script>
    $(document).ready(function() {

        var json_data_chk =  <?php echo($data); ?>;
        var json_data = JSON.stringify(json_data_chk);
        alert(json_data);
// code     
var sImageUrl = "img/";


        var oTable = $('#hidden-table-info').dataTable( {
            "bProcessing": true,
           "sAjaxSource": "objects.txt",
            "bServerSide": false,
             "aoColumns": [
                {
                   "mDataProp": null,
                   "sClass": "control center",
                   "sDefaultContent": '<img src="'+sImageUrl+'details_open.png'+'">'
                },
                { "mDataProp": "Rendering_engine" },
                { "mDataProp": "Browser" },
                { "mDataProp": "Platforms" },

            ],
// code

    </script>

编辑： json_data 是与 objects.txt 具有相同 json 数据的变量，但我不想调用该文件，而是使用该变量中的数据

【问题讨论】：

如果数据是通过ajax调用获取的，那么你应该设置bServerSide: true并将ajax请求的url给sAjaxSource。即sAjaxSource: $url
数据在变量中，需要收集它......我可以从文件中这样做。但想直接从变量中获取它而不是写入某个文件
@Hamid json_data 是与 objects.txt 具有相同 json 数据的变量，但我不想调用该文件，而是使用该变量中的数据
这种情况下，你总是可以构造表dom，然后调用$().dataTable();就可以了。
另外，看看这个：stackoverflow.com/q/9669812/2139684

标签： php jquery ajax json datatable

【解决方案1】：

你可以使用这个指令

$('#example').dataTable( {
  "ajax": "json_data"
} );

或者这个：

 "ajax": {
    "url": "data.json",
    "type": "POST"
  }

参考：https://datatables.net/reference/option/ajax

【讨论】：