Just getting Started: AJAX Dataset not being used - Some basic help required...

stiggy8

The return from my ajax call is below...
[{"recNum":1,"subC":"MyCity","wName":"MyValue","wYear":"2013"},{"recNum":2,"subC":"MyCity2","wName":"MyValue2","wYear":"2012",}]

And my DataTable is not getting populated: below is my Javascript...

    $('#myTbl').DataTable( {
            order: [[ 2, "wName" ]],
            processing: true,
            serverSide: true,
            ajax: {
                url: "MyDataLoader.php",
                type: "POST"
            },
            columns: [
                { "data": "recNum" },
                { "data": "subReg" },
                { "data": "wName" },
                { "data": "wYear" }
            ]

    });

What am I doing wrong with this set up? My HTML is a basic table is below

    <table id="myTbl" class="display">
            <thead>
                <tr>
                    <th>No.</th>
                    <th>Sub C</th>
                    <th>WName</th>
                    <th>Year</th>

stiggy8

SubC and SubReg are the same... forgot to edit the post

stiggy8

I've changed my structure to a "Flat Data Source" based on the format of my ajax return (standard PHP json_encode). The DataTables sample shows that the data format matches... but I'm still not getting any output in my table. I have a working version that just uses javascript data format... so I know that I have all the js and css links correct. The only thing that is changed is the source data. Any thoughts would be appreciated...

jLinux

All you need to do is have that json inside data..

{"data":[{"recNum":1,"subC":"MyCity","wName":"MyValue","wYear":"2013"},{"recNum":2,"subC":"MyCity2","wName":"MyValue2","wYear":"2012",}]}

stiggy8

Thanks jLinux,
However my data source is dynamic... thus the ajax call... So my data source is actually numerous and variable rows.

So after more research on the data formats - I changed my DataTable call (below) to support the Flat Data Source (ie', dataSrc = ""). But that still isn't working. I can dump the ajax output on the server side and confirm that the data looks good... but something still seems to be missing. One thing that is odd - the wYear column is displayed for the table - but doesn't have "sort" icons... almost seems like the data is being truncated in the processing on the DataTable side...

   $('#myTbl').DataTable({
    order: [[ 2, "wName" ]],
        ajax: {
            url: "MyDataLoader.php",
            dataSrc: ""
        },
        columns: [
            { "data": "recNum" },
            { "data": "subR" },
            { "data": "wName" },
            { "data": "wYear" }
        ]
    }); 

stiggy8

Hey - just found it... I had an extra column in my html - so the datatable write was failing. The "strange sort" icon thing clued me in...

Once I corrected that - it all works.

Thanks

allan

Yes, that dataSrc: '' means that you can use an array directly from the data source. Good to hear that you've got this sorted. It looks like I might need to add some more debug / catch code for things like this.

Allan