I understand this a popular issue, and I have read all the similar questions here on Stack Overflow and other sites (including the datatables website).

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

To clarify, I am using

为了澄清，我正在使用

• PHP Codeigniter
• PHP Codeigniter
• Materliazecss
• Materliazecss

I have also made sure that I received the JSON array correctly:

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

[{"name_en":"hello","phone":"55555555","email":"a.shouman","facebook":"https:\/\/www.facebook.com"},{"name_en":"Mahfouz","phone":"00000000","email":"m.mahfouz","facebook":null},{"name_en":"Abdelrahman","phone":"55555555","email":"a.shouman","facebook":"https:\/\/www.facebook.com"},{"name_en":"ayman test","phone":"55554444","email":"a.shouman","facebook":"https:\/\/www.facebook.com"},{"name_en":"Abdelrahman Mossad Shouman Bootstrap","phone":"12345678","email":"a.shouman@mail.com","facebook":"https:\/\/www.facebook.com"},{"name_en":"Abdelrahman Mossad Shouman Bootstrap","phone":"12345678","email":"a.shouman@mail.com","facebook":"https:\/\/www.facebook.co"},{"name_en":"a.sharara","phone":"00000000","email":"a.sharara","facebook":""}]

My HTML table looks like this:

我的HTML表格如下所示：

<table id="customer_table">
     <thead>
         <tr>
            <th>Name</th>
            <th>Contact</th>
            <th>Email</th>
            <th>Facebook</th>
         </tr>
     </thead>
</table>

And here is my document.ready function:

这是我的document.ready功能：

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

The error I am getting is

我得到的错误是

Uncaught TypeError: Cannot read property 'length' of undefined

未捕获的TypeError：无法读取未定义的属性“长度”

5 个解决方案

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

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

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

 $(document).ready(function(){   

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

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