This TableTools example shows DataTables using its ability to Ajax load object based data and operate in + exactly the same manner as when the data is read directly from the document.
+| 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( {
+ dom: 'T<"clear">lfrtip',
+ "ajax": "../../../../examples/ajax/data/objects.txt",
+ "columns": [
+ { "data": "name" },
+ { "data": "position" },
+ { "data": "office" },
+ { "data": "extn" },
+ { "data": "start_date" },
+ { "data": "salary" }
+ ],
+ deferRender: true
+ } );
+} );
+
+ 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.
+The script used to perform the server-side processing for this table is shown below. Please note that this is just an example script using PHP. Server-side + processing scripts can be written in any language, using the protocol described in the DataTables + documentation.
+