"Although DataTables can obtain information about the table directly from the DOM, you may wish to give DataTables specific instructions for each individual column. This can be done using either the aoColumnDefs parameter, or aoColumns and the object information given for each column." — http://datatables.net/usage/columns
Something like:
html
<table class="display" id="table"></table>
js
$("#table").dataTable({
bJQueryUI:true,
aoColumns:[
{mDataProp:"foo",sTitle:"Foo Title"},
{mDataProp:"bar",sTitle:"Bar Title"}
],
fnServerData: function( sUrl, data, fnCallback){
$.get('data.php', function(res) {
fnCallback({ // process results to match table format
"sEcho":config.sEcho,
"iTotalRecords":res.data.total || res.data.count,
"iTotalDisplayRecords":res.data.count || res.data.total,
"aaData":res.data.list
})
});
}
})
Where data.php is
{
data:{
total:200,
count:3,
list:[
{foo:"Foo 1",bar:"Bar 1"},
{foo:"Foo 2",bar:"Bar 2"},
{foo:"Foo 3",bar:"Bar 3"},
]
}
}
There's also a good summary of setting this up here:
http://datatables.net/usage/options#aaData