Question

我理解这是一个受欢迎的问题，我已经在Stack Overflow和其他网站（包括datatables网站）上阅读了所有类似的问题。

澄清一下，我正在使用

PHP Codeigniter
Materliazecss

我还确保我正确收到了JSON数组：

[{"name_en":"hello","phone":"55555555"},{"name_en":"hi","phone":"00000000"}]

我的HTML表格如下：

<table id="customer_table">
     <thead>
         <tr>
            <th>Name</th>
            <th>Phone</th>
         </tr>
     </thead>
</table>

这是我的document.ready功能：

  $(document).ready(function(){
            //$('#customer_table').DataTable();
            $('#customer_table').DataTable( {
                "ajax": 'json',
                "dataSrc": "",
                 "columns": [
                    { "data": "email" },
                    { "data": "name_en" }
                ]
            });
  });

我得到的错误是

未捕获的TypeError：无法读取属性＆＃39;长度＆＃39;未定义的

Answer 1

它甚至更简单：只需在ajax定义中使用dataSrc:''选项，因此dataTable知道期望数组而不是对象：

    $('#pos-table2').DataTable({
                  processing: true,
                  serverSide: true,
                  ajax:{url:"pos.json",dataSrc:""}
            }
    );

请参阅ajax options

Answer 2

好的，谢谢大家的帮助。

然而问题要比那容易得多。

我需要做的就是修复我的JSON以将数组分配给名为data的属性，如下所示。

{
  "data": [{
    "name_en": "hello",
    "phone": "55555555",
    "email": "a.shouman",
    "facebook": "https:\/\/www.facebook.com"
  }, ...]
}

Answer 3

尝试如下，返回必须是d，而不是d.data

 ajax: {
      "url": "xx/xxx/xxx",
      "type": "GET",
      "error": function (e) {
      },
      "dataSrc": function (d) {
         return d
      }
      },

Answer 4

原因

此错误TypeError: Cannot read property 'length' of undefined通常意味着jQuery DataTables无法在对Ajax请求的响应中找到数据。

默认情况下，jQuery DataTables期望数据采用以下所示格式之一。发生错误是因为返回的数据不是默认格式。

数组数组

{ 
   "data": [
      [
         "Tiger Nixon",
         "System Architect",
         "$320,800",
         "2011/04/25",
         "Edinburgh",
         "5421"
      ]
   ]
}

对象数组

{ 
   "data": [
      {
         "name": "Tiger Nixon",
         "position": "System Architect",
         "salary": "$320,800",
         "start_date": "2011/04/25",
         "office": "Edinburgh",
         "extn": "5421"
      }
   ]
}

解决方案

使用默认格式或使用ajax.dataSrc选项在Ajax响应中定义包含表数据的数据属性（默认为data）。

有关更多信息，请参见Data array location。

链接

有关更多详细信息，请参见jQuery DataTables: Common JavaScript console errors。

Answer 5

如果您有JSON数据，则会出现以下错误 enter image description here

更好的解决方案是为本地json数组对象分配var data，详情请参阅：https://datatables.net/manual/tech-notes/4

这有助于您显示表格内容。

 $(document).ready(function(){   

        $('#customer_table').DataTable( {
         "aaData": data,

           "aoColumns": [{
                            "mDataProp": "name_en"
                        }, {
                            "mDataProp": "phone"
                        }, {
                            "mDataProp": "email"
                        }, {
                            "mDataProp": "facebook"
                        }]
            });
        });

Answer 6

如果您将ajax用作函数，请记住，它希望在设置了参数的情况下将JSON数据返回给它。

$('#example').dataTable({
    "ajax" : function (data, callback, settings) {
        callback({
            data: [...],
            recordsTotal: 40,
            recordsFiltered: 40}
            ));
    }
})

Answer 7

当您的视图属性名称和数据表的列部分内的名称不匹配时，可能会发生这种情况。确保属性名称和列数据名称匹配

Answer 8

就我而言，我必须将我的json分配给一个名为 aaData 的属性，就像在Datatables中一样 ajax example哪些数据看起来像 this

Answer 9

虽然以上答案很好地说明了这种情况，但在对问题进行故障排除时，还请检查浏览器确实已获得DataTables期望的格式。可能还有其他原因无法获得data。例如，如果用户无权访问数据URL而是获取一些HTML。或远程系统上有一些不幸的“修复程序”。浏览器的“调试”工具中的“网络”标签会提供帮助。

Answer 10

您可以在渲染电子邮件字段时尝试检查您的字段，而该字段在ajax中不可用

$.ajax({
  url: "url",
  type: 'GET',
  success: function(data) {
    var new_data = {
      "data": data
    };
    console.log(new_data);
  }
});

Answer 11

这对聚会来说真的很晚，但是上面的解决方案都不适合我。我不希望使用“ SELECT *, "lost" as flag FROM `user_statements_lost` WHERE `note` = "CoinFlip" UNION ALL SELECT *, "won" as flag FROM `user_statements_won` WHERE `note` = "CoinFlip" ORDER BY `transactionIdentifier` DESC”，所以在config中添加了Found total xxx records。当我删除所有内容后。

我应该注意第一页加载良好。当我单击下一步时，第二个页面已加载，但立即引发了上述控制台错误

DataTables：无法读取属性＆＃39;长度＆＃39;未定义的

11 个答案:

原因

解决方案

链接