Abdel-Rahman Shoman Abdel-Rahman Shoman - 1 year ago 913
jQuery Question

DataTables: Cannot read property 'length' of undefined

So I know this a popular issue and I have read all the similar questions here on Stackoverflow and other sites (including datatables site).

To clarify I am using

  • PHP Codeigniter

  • Materliazecss

I have also double checked and made sure that I managed to receive the JSON array correctly as following: (You may check it also on http://www.jsoneditoronline.org/)

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

So my html Table is as following

<table id="customer_table">

And here is my document.ready function

$('#customer_table').DataTable( {
"ajax": 'json',
"dataSrc": "",
"columns": [
{ "data": "email" },
{ "data": "facebook" },
{ "data": "name_en" },
{ "data": "phone" }

The error I am getting is this

Uncaught TypeError: Cannot read property 'length' of undefined

Answer Source

OK, thanks all for the help.

However the problem was much easier than that.

All you I needed to do is to fix my JSON to assign the array to an attribute called data, as following.

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