Datatables TypeError: aData is undefined-Collection of common programming errors

I want to populate datatables with database values in a table. Below is my code listing, everything seems to be ok but an error is returned “TypeError: aData is undefined” so datatables is not created

$(document).ready(function() {
    $('#listax').dataTable({
        "bProcessing": true,
        "bLengthChange": true,
        "bFilter": true,
        "bSort": true,
        "bInfo": true,
        "bAutoWidth": true,
        "bServerSide": true,
        "sServerMethod": "POST",
        "sAjaxSource": "ajax_live/getUsers",
        "aoColumns": [
            null,
            null //put as many null values as your columns
        ]
    });
});

Server side

 function getUsers(){
     $this->db->select('id,username');
     $query = $this->db->get('user');
     $data = $query->result();
     echo json_encode($data); 
 }

This is the data returned by json encode

[
    {"id":"6","username":"Lab23"},
    {"id":"11","username":"MaryMM"}
]

1. When I have done this I have had to define the columns. Example array being sent back;

   Array
   (
       [0] => stdClass Object
           (
               [id] => 6
               [username] => "Lab23"
           )
       [1] => stdClass Object
           (
               [id] => 11
               [username] => "MaryMM"
           )
   )
   

   So if your json encoded array has key values of id and username the datatables would have the following segment in it.

   $(document).ready(function() {
       $('#listax').dataTable({
           "bProcessing": true,
           "bLengthChange": true,
           "bFilter": true,
           "bSort": true,
           "bInfo": true,
           "bAutoWidth": true,
           "bServerSide": true,
           "sServerMethod": "POST",
           "sAjaxSource": "ajax_live/getUsers",
           "aoColumns":[
               {"mDataProp":"id"},
               {"mDataProp":"username"}
           ]
       });
   });
   

Originally posted 2013-11-09 23:16:38.