[Solved] How to send Columns names to datatables with serverside and ajax

xtrm

Hi, I have been trying to send column names to the datatable and after some time playing and reading some topics about it, I have been able to send them. Its really awesome in case you have thousands of tables with a lot of different content or even tables with dinamically generated content (ie: searches). It could be difficult if you are new to datatables and dont know much ajax, but with the example and links you will see that its not that hard. Thanks allan and others for the help in those threads.

Forum Threads with essential info:
http://datatables.net/forums/discussion/5132/custom-columns-with-server-side-processing/p1
http://datatables.net/forums/discussion/3519/x
http://datatables.net/forums/discussion/152/x
http://datatables.net/forums/discussion/3442/aocolumndefs-fnrender-.getjson-combo/p1

Datatables js example code:
[code]

try
{
$(document).ready(function()
{
var ex = document.getElementById('example');
//alert( $.fn.dataTable.fnVersionCheck( '1.9.0' ) );
if (ex != null)
{
if ( ! $.fn.DataTable.fnIsDataTable( ex ))
{
var aoColumns;
$.ajax(
{
"dataType": 'json',
"url": "<?php echo '/' . $sModuleName . '/getajaxdatacolumns' ?>",
"type": 'POST',
"contentType": "application/json; charset=utf-8",
/*error: function()
{
return true;
},*/
"success": function(data)
{
//alert("aoColumns success");
aoColumns = data.aoColumns;

$('#example').dataTable(
{
"aoColumns": aoColumns,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "<?php echo '/' . $sModuleName . '/getajaxdata' ?>",
"fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay )
{
var nCells = nRow.getElementsByTagName('th');
},
} ).columnFilter
({
});//--end datatable----------------------------------
} //**end success
});//**end ajax aocolumn

} //end if is datatable
} //ex is not null
} ); //end onready
} //end try
catch (ex)
{
alert(ex.toString());
}

[/code]
------

php generic getajaxdatacolumns (symfony)
[code]
public function executeGetajaxdatacolumns(sfWebRequest $request)
{
$vfinal = array();
$dRes = sfActionsExt::getTableColumnNamesfromDB($sModuleName, $vcolumnnames); //get column names
foreach ($vcolumnnames as $column)
{
$vfinal["aoColumns"][]['sTitle'] = Encoding::toUTF8($column); //make sure column names are in UTF8 or convert them
}

return $this->renderText(json_encode($vfinal)); //encode the array with column names, which must be in UTF8.
}
[/code]
------

Result must look like this when it has been encoded with json_encode. Use and enable Firebug to see the response.
[code]{"aoColumns":[{"sTitle":"ID"},{"sTitle":"Name"},{"sTitle":"Created at"}]}[/code]


----

*Also remember that you will not need to print the column values inside the tags in the section, nor in the section.
You will need to print just as many as the total number of columns, both in header section and footer section. Datatables will automatically fill those tags with the column value, as it does with the data section.
Example with 2 columns in table, you will need to print:
[code]




















[/code]