javascript 为什么 jQuery dataTables 不能解析我的 JSON?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12847627/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 17:15:35  来源:igfitidea点击:

Why can't jQuery dataTables parse my JSON?

javascriptjqueryjsondatatables

提问by IAmYourFaja

I am trying to populate a dataTableas follows:

我正在尝试按如下方式填充数据表:

$("#my-datatable").dataTable( {
    "sAjaxSource" : "/someURLOnMyServer",
    "bDestroy" : true,
    "fnServerParams" : function(serverParams) {
        serverParams.push(
            {
                "name" : "widget",
                "value" : token
            }
        );
    }
});

And the HTML table it is populating:

以及它正在填充的 HTML 表:

<table id="my-datatable">
    <thead>
        <tr>
            <th>Type</th>
            <th>Value</th>
            <th>ID</th>
            <th>Fizz</th>
            <th>Buzz</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

According to Firebug, the JSON coming back from the server is:

根据 Firebug,从服务器返回的 JSON 是:

[
   {
      "id":1,
      "attributeType":{
         "id":1,
         "name":"test1",
         "tag":"test-type",
         "is-dog":false
      },
      "attributeValue":{
         "id":null,
         "name":"blah",
         "tag":"BLAH"
      },
      "buzz":1,
      "fizz":"53abc"
   }
]

But Firebug is throwing the following JavaScript error in its console:

但是 Firebug 在其控制台中抛出以下 JavaScript 错误:

TypeError: aData is undefined
[Break On This Error]   

for ( i=0 ; i<aData.length ; i++ ) --> jquery.dataTables.js (line 2541)

Can anyone spot what's going wrong? Either I'm not setting up my dataTableobject correctly, or the JSON coming back doesn't match the "schema" of the HTML table it is trying to populate. Either way, I'm lost. Thanks in advance!

任何人都可以发现出了什么问题吗?要么我没有dataTable正确设置我的对象,要么返回的 JSON 与它试图填充的 HTML 表的“架构”不匹配。不管怎样,我迷路了。提前致谢!

回答by Maktouch

Datatables requires a certain format for results. If you are not using that format, you have to declare everything.

数据表需要特定的结果格式。如果您不使用该格式,则必须声明所有内容。

$('#my-datatable').dataTable( {

    "sAjaxSource": "/url/here",


    "fnServerData": function ( sSource, aoData, fnCallback ) {
            aoData.push( { "name": "widget", "value": "token" } );

            request = $.ajax({
              "dataType": 'json', 
              "type": "GET", 
              "url": sSource, 
              "data": aoData, 
              "success": fnCallback
            });
      },


      "aoColumns": [
            { "mDataProp": "id"},
            { "mDataProp": "fizz"},
            { "mDataProp": "name"},
            { "mDataProp": "tag"},
            { "mDataProp": "tag"},
            { "mDataProp": "attributeValue.name"},
            { "mDataProp": "attributeValue.tag"},
        ],

    });

This is the format: http://datatables.net/release-datatables/examples/server_side/post.html

这是格式:http: //datatables.net/release-datatables/examples/server_side/post.html

回答by ajp

Try to enclose your JSON object with aaDatalike:

尝试将您的 JSON 对象括起来,aaData例如:

{"aaData" : 

[{"id":1,"attributeType":{"id":1,"name":"test1","tag":"test-type","is-dog":false},"attributeValue":{"id":null,"name":"blah","tag":"BLAH"},"buzz":1,"fizz":"53abc"}]

}