DataTables server-side processing example


It can often be useful to send a little bit of extra information to the server when utilising DataTables' server-side processing option. This can be done by overriding the function used internally to get the JSON data from the server through the use of the "fnServerData" callback. This function takes three parameters (the same as $.getJSON(), to be manipulated as you wish. This allows you to add extra data to the second parameter and then make the AJAX call, or you can call a Google Gears DB, or whatever you want. This example shows adding a single extra HTTP variable.

Live example

Rendering engine Browser Platform(s) Engine version CSS grade
Loading data from server
Rendering engine Browser Platform(s) Engine version CSS grade

Initialisation code

$(document).ready(function() {
	$('#example').dataTable( {
		"bProcessing": true,
		"bServerSide": true,
		"sAjaxSource": "../examples_support/server_processing.php",
		"fnServerData": function ( sSource, aoData, fnCallback ) {
			/* Add some extra data to the sender */
			aoData.push( { "name": "more_data", "value": "my_value" } );
			$.getJSON( sSource, aoData, function (json) { 
				/* Do whatever additional processing you want on the callback, then tell DataTables */
			} );
	} );
} );

Other examples

Basic initialisation

Advanced initialisation

Data sources

Server-side processing



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