DataTables dynamic creation example

Preamble

At times you will wish to be able to create a table from dynamic information passed directly to DataTables, rather than having it read from the document. This is achieved using the "aaData" array in the initialisation object. A table node must first be created before the initialiser is called (as shown in the code below). This is also useful for optimisation - if you are able to format the data as required, this method can save a lot of DOM parsing to create a table.

Live example

Initialisation code

function success(json) {
  $('#example').dataTable( {
    "aaData": json.records.rows,
    "aoColumns": [
      { "sTitle": "Engine" },
      { "sTitle": "Browser" },
      { "sTitle": "Platform" },
      { "sTitle": "Version", "sClass": "center" },
      { "sTitle": "Grade", "sClass": "center" }
    ],
				"bPaginate": false,
				"bLengthChange": false
  } );  
}
$(document).ready(function () {
  var rdb = new SQLEngine("r0000000002","-",'rdbhost');
  $('#dynamic').html( '>table cellpadding="0" cellspacing="0" border="0" '+
                      'class="display" id="example"><\/table>' );
  var q = 'SELECT * FROM css_data';
  var res = rdb.query({  'callback': success,
                         'q': q	 })
})

Please refer to the DataTables documentation for full information about its API properties and methods.