DataTables: Cannot read property 'length' of undefined

Question

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).

To clarify, I

Answer 1

This is really late to the party, but none of the solutions above worked for me. I didn't want the "Found total xxx records" so I added info:false to the config. When I removed that everything worked.

I should note that the first page loaded fine. When I hit next, the second page loaded, but immediately threw the above console error

Answer 2

you can try checking out your fields as you are rendering email field which is not available in your ajax

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

Answer 3

It's even simpler: just use dataSrc:'' option in the ajax defintion so dataTable knows to expect an array instead of an object:

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

See ajax options

Answer 4

In my case, i had to assign my json to an attribute called aaData just like in Datatables ajax example which data looked like this.

Answer 5

When you have JSON data then the following error appears

A better solution is to assign a var data for the local json array object, details see: https://datatables.net/manual/tech-notes/4

This is helps you to display table contents.

 $(document).ready(function(){   

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

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