jquery datatables contains blank table headers

Question

I am attempting to use the jquery datatables plugin to populate a html table via a JSON object returned from a PHP script. I have a bit of confusion concerning naming of the json object and options in the datatables plugin. Passing back a json object like so:

echo json_encode(array('data'=>$res));

yields:

Uncaught TypeError: Cannot read property 'length' of undefined 

while changing data to aaData successfully populates the table, however without headers.

Several fourm posts mentioned the json object must be returned as aaData, but the datatables example documentation on their website gives an example json object named with data.

Here is my current client side code, I am relatively certain that my server side is correct.

$('document').ready(function(){
    $('#result').dataTable({
        "ajax": {
            'url' : 'ppmAlarms.php',

        },

        "columns": [
            { "data": "location" },
            {"data" : "descAndType" },
            {"data" : "timestamp"}
        ]
    });

    });

JSON structure is as follows:

{
  "aaData": [
    {
      "location": "loc1",
      "descAndType": "desc1",
      "timestamp": "2014-08-20 11:34:10"
    }
]
}

Answer 1

Just realized I just have to specify my own column headers in thead, they aren't populated:

<thead>
      <tr>
         <th>Name</th>
         <th>Position</th>
         <th>Office</th>
         <th>Extn.</th>
         <th>Start date</th>
         <th>Salary</th>
     </tr>
</thead>