为什么 jQuery dataTables 不能解析我的 JSON? [英] Why can't jQuery dataTables parse my JSON?

问题描述

我正在尝试按如下方式填充 dataTable:

$("#my-datatable").dataTable( {"sAjaxSource": "/someURLOnMyServer","bDestroy" : 真,fnServerParams":函数(serverParams){serverParams.push({名称":小部件"，价值":令牌});}});

以及它正在填充的 HTML 表格:

<头><tr><th>类型</th><th>值</th><th>ID</th><th>Fizz</th><th>嗡嗡声</th></tr></thead><tbody></tbody>

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

<预><代码>[{身份证":1，属性类型":{身份证":1，"name":"test1","标签":"测试类型",是狗":假},属性值":{id":空，"name":"等等",标签":BLAH"},嗡嗡声":1，"嘶嘶声":"53abc"}]

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

TypeError: aData is undefined[打破这个错误]for ( i=0 ; ijquery.dataTables.js(第 2541 行)

谁能发现哪里出了问题?要么我没有正确设置 dataTable 对象，要么返回的 JSON 与它试图填充的 HTML 表的架构"不匹配.不管怎样，我迷路了.提前致谢！

解决方案

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

$('#my-datatable').dataTable( {"sAjaxSource": "/url/here",fnServerData":函数(sSource，aoData，fnCallback){aoData.push( { "name": "widget", "value": "token" } );请求 = $.ajax({"数据类型": 'json',类型":获取"，网址":sSource，数据":aoData，成功":fnCallback});},"aoColumns": [{mDataProp":id"}，{mDataProp":嘶嘶声"}，{mDataProp":名称"}，{mDataProp":标签"}，{mDataProp":标签"}，{ "mDataProp": "attributeValue.name"},{ "mDataProp": "attributeValue.tag"},],});

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

I am trying to populate a dataTable as follows:

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

And the HTML table it is populating:

<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:

[
   {
      "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:

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 dataTable object 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!

解决方案

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

这篇关于为什么 jQuery dataTables 不能解析我的 JSON?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！