jquery datatables stuck on AJAX server side table

Question

All,

Wondering if someone could help. I've been using DataTables quite some time both via dom manipulation and JSON code. However, two of our larger resultsets are still running too slow, so I'm attempting to convert them over to client-side data sources. I have the table there, with headers, but the data is not being injected into the markup.

I've built the output page and copied a snippet of the output from that code for reference. It is validating via JSON validator and I can see no differences between it and the example code. In fact, at one point I tried using the example data on my site to get this working to no avail. Not that it matters, but my JSON is created via a Symfony action which is able to be directly accessed (with login, of course) I can successfully see the validated JSON output on Firebug via XHR call so I know its available at runtime to the browser. I have had other datatables running in this page, so the includes are properly setup. My theory is that something related to instantiation, be it a mal-formed parameter or a missing command, that is causing this to fail without error.

The following is my code:

AJAX page output (truncated for clarity purposes):

{"sEcho": 0, "iTotalRecords": 1788, "iTotalDisplayRecords": 1788, "aaData":[["", "<a href=\"/web/link/123\"><img border=\"0\" alt=\"View Prospect\" src=\"/web/images/view.png\" /></a>", "First", "Last", "company ", "address", "city", "state", ""] ,["", "<a href=\"/web/link/124\"><img border=\"0\" alt=\"View Prospect\" src=\"/web/images/view.png\" /></a>", "first1", "last1", "company1", "address1", "city1", "state1", "email1"] ]}

Jquery Initialization:

jQuery('#prospectList').dataTable( {
         "bProcessing": true,
         "bServerSide": true,
         "sAjaxSource": "/web/prospect/ajax",
         "bJQueryUI": true,
         "sPaginationType": "full_numbers",
         "bAutoWidth": false,
         "bFilter":true,
         "bLengthChange": true,
         "bPaginate": true,
         "bSort": true,
         "iDisplayLength": 10,
         "bInfo": true,
         "aoColumns": [
            { "sTitle": "Action" },
            { "sTitle": "First Name" },
            { "sTitle": "Last Name" },
            { "sTitle": "Company" },
            { "sTitle": "Street"},
            { "sTitle": "City" },
            { "sTitle": "State" },
            { "sTitle": "Email" }
         ]
      })

Anybody see anything missing? Thanks in advance.

Answer 1

Ok, got it. The "sEcho" value in the string was set to 0 by default for testing. It will not do anything unless set to 1. Also, be careful to ensure that the values being passed via JSON are properly encoded as ints.