Question

I am attempting to get dataTables plugin to work with information for a website. I have read the documentation and various support threads for datatables as well as various StackOverflow questions, to no avail in resolution. According to the above documentation, the code I have should work just fine… it doesn’t.

Javascript:

$(document).ready( function(){
 $('#results_table').dataTable( {
  'bServerSide': true,
  'sAjaxSource': 'results.php',
  'fnServerParams': function ( aoData ) {
    aoData.push( { 't': Math.random() }); 
    }
   });
});

HTML Code:

<div id='results'>
  <table id='results_table' >
   <thead>
    <tr>
    <th>Num</th>
    <th>Type</th>
    <th>Access date</th>
    <th>Access name</th>
   </tr>
  </thead>
 <tbody>
</div>

PHP snippet (after retrieving/formatting SQL data:

$output = array('sEcho'=>1,'iTotalRecords'=>$count, 'iTotalDisplayRecords'=>$count, 'aaData'=> $results);
echo json_encode($output);

Returned data (small subset of the total for testing):

{"sEcho":1,"iTotalRecords":3,"iTotalDisplayRecords":3,"aaData":[["1707052901-1A","D","Aug 17, 2012 1:54 PM","aqr"],["1707052901-1A","C","Aug 17, 2012 1:53 PM","aqr"],["2835602-4A","D","Aug 15, 2012 7:39 AM","aqr"]]}

Now, when I load the page with datatables I receive an extremely helpful answer regarding –

Uncaught TypeError: Cannot read property ‘length’ of undefined jquery.dataTables.min.js:49

and the table does not populate with information.

Question: What am I doing wrong; why does my implementation of server-side processing for dataTables not work?? How can I fix this to display properly?

Answer 1

aoData.push( { 't': Math.random() }); 

should be used like this:

aoData.push( { 'name': 't', 'value':Math.random() }); 

not sure if this is the issue, but this fixed some of my problems when using datatables