数据表TypeError：aData未定义

Question

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

<script type="text/javascript">
$(document).ready(function() {
    $('#listax').dataTable({
        "bProcessing": true,
        "bLengthChange": true,
        "bFilter": true,
        "bSort": true,
        "bInfo": true,
        "bAutoWidth": true,
        "bServerSide": true,
        "sServerMethod": "POST",
        "sAjaxSource": "<?php echo base_url(); ?>ajax_live/getUsers",
        "aoColumns": [
            null,
            null //put as many null values as your columns
        ]
    });
});
</script>

<table id="listax"></table>

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"}
]

Answer 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": "<?php echo base_url(); ?>ajax_live/getUsers",
        "aoColumns":[
            {"mDataProp":"id"},
            {"mDataProp":"username"}
        ]
    });
});