Using ajax to load a jQuery DataTable

Question

I\'m trying (and failing) to load a jQuery DataTable using the built-in ajax source argument. The datatable, however, shows the message \"Loading...\" where the row(s) shou

Answer 1

according to the website your service should return data in this format:

{
  "aaData": [
    [
      "row 1 col 1 data",
      "row 1 col 2 data",
      "row 1 col 3 data",
      "row 1 col 4 data"
    ],
    [
      "row 2 col 1 data",
      "row 2 col 2 data",
      "row 2 col 3 data",
      "row 2 col 4 data"
    ],
    [
      "row 3 col 1 data",
      "row 3 col 2 data",
      "row 3 col 3 data",
      "row 3 col 4 data"
    ],
    [
      "row 4 col 1 data",
      "row 4 col 2 data",
      "row 4 col 3 data",
      "row 4 col 4 data"
    ]
  ]
}

so, wrap your array in an object, name the array as aaData and try again. or you can name it any way you like, but then you need to add the sAjaxDataProp parameter in the datatables initialisation (say you name it data you would do it like this:

$('#example').dataTable( {
    "bProcessing": true,
    "sAjaxSource": "/ajaxsource/callmydata",
    "sAjaxDataProp": "data"
} );

Answer 2

If your ajax source returns

[[[Hello], [Goodbye], [Test1], [Test2]]]

This is not ok for datatables. It should be:

{
     iTotalRecords: "54",
     iTotalDisplayRecords: "22",
     aaData: "[['Hello', 'Goodbye', 'Test1', 'Test2']]"
}

aaData stands for array of arrays.