It can often be useful to send extra information to the server when utilising DataTables'
server-side processing option. This is done by using the ajax
option's data parameter which can be used in one of two different ways:
object - An object data to send to the server. This is useful for adding static
data to the request.function - A function which will manipulate the data object to send to the server,
adding values as required. Using the data parameter as a function allows the
additional data to evaluated and added to the request at the time the request is made.The example below shows server-side processing being used with an extra parameter being sent to the
server by using the ajax.data option as a function.
| Name | Position | Office | Extn. | Start date | Salary |
|---|---|---|---|---|---|
| Name | Position | Office | Extn. | Start date | Salary |
The Javascript shown below is used to initialise the table shown in this example:
$(document).ready(function() {
$('#example').dataTable( {
"processing": true,
"serverSide": true,
"ajax": {
"url": "scripts/server_processing.php",
"data": function ( d ) {
d.myKey = "myValue";
// d.custom = $('#myInput').val();
// etc
}
}
} );
} );
In addition to the above code, the following Javascript library files are loaded for use in this example:
The HTML shown below is the raw HTML table element, before it has been enhanced by DataTables:
This example uses a little bit of additional CSS beyond what is loaded from the library files (below), in order to correctly display the table. The additional CSS used is shown below:
The following CSS library files are loaded for use in this example to provide the styling of the table:
This table loads data by Ajax. The latest data that has been loaded is shown below. This data will update automatically as any additional data is loaded.