DataTables logo DataTables

This site contains the legacy documentation for DataTables v1.9 and earlier for reference only.
DataTables 1.9 was End Of Life in 2014. Do not use it for new work.
The current release of DataTables can always be found on DataTables.net.
TableTools v2.2.0

Initialisation

Initialisation of TableTools is typically done at the same time as the initialisation of DataTables through the sDom and oTableTools properties. Customisation of TableTools is done through the properties of the oTableTools object - a full list of the options available is provided before. It is also possible to initialise TableTools directly, which can be useful when you want an easy reference to the instance, or to place the toolbar outside the DataTables DOM structure.

DataTables properties

oTableTools
Show details 		To customise the TableTools options through the DataTables initialisation object, you can make use of this parameter. Any of the options given in the "Initialisation parameters" section below can be used here.
Default: {}
Type: Object
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"sSwfPath": "/swf/copy_csv_xls_pdf.swf"
		}
	} );
} );
sDom
Show details 		The sDom parameter in DataTables is used to position the various controls that DataTables adds to the table (filtering, paging etc) in the DOM. This will directly effect the position of the elements in the display, when combined with your CSS. TableTools can be included by inserting the character 'T' into sDom. This is all that is needed to initialise TableTools - everything is options and customisation.
Default: lfrtip
Type: String
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip'
	} );
} );

Initialisation parameters

aButtons
Show details 		This parameter defined the buttons that TableTools will use and provides the primary focus for customisation of TableTools. In it's basic form the elements of this array are strings which match the predefined buttons, but the elements can also be objects which define your own buttons, or override the default actions. This is fully explained on the Buttons page.
Default: [ "copy", "csv", "xls", "pdf", "print" ]
Type: Array
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"aButtons": [ "copy", "print" ]
		}
	} );
} );
fnPreRowSelect
Show details 		This is a callback function which is fired just prior to a row being selected (i.e. the mouse down has occurred, but TableTools has not yet selected the row). It can be used to cancel the selection if needed.
Default:
Input parameters:
  1. event : click event which occurred to select this row
  2. array - node : TR elements to be selected
Return parameter: Boolean - true if the row can be selected, false if it cannot.
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"fnPreRowSelect": function ( e, nodes ) {
				if ( e.currentTarget.className.indexOf('no_select') != -1 ) {
					return false;
				}
				return true;
			}
		}
	} );
} );
fnRowDeselected
Show details 		Callback function which is called when a row is deselected (i.e. the opposite of fnRowSelected).
Default:
Input parameters:
  1. array - node : TR elements that were deselected
Return parameter: void
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"fnRowDeselected": function ( nodes ) {
				alert( 'The row with ID '+nodes[0].id+' was deselected' );
			}
		}
	} );
} );
fnRowSelected
Show details 		Callback function which occurs when a row is selected. This allows a particular action to occur when any row is selected (a selected row counter for example).
Default:
Input parameters:
  1. array - node : TR elements that were selected
Return parameter: void
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"fnRowSelected": function ( nodes ) {
				alert( 'The row with ID '+nodes[0].id+' was selected' );
			}
		}
	} );
} );
sRowSelect
Show details 		TableTools provides everything that is needed to allow the end user to select rows in a table (by clicking on them). This is disabled by default, but can be readily enabled by setting this property to either "single" (to allow only one row in the table to be selected at a time), "multi" (to allow any number of rows to be selected) or "os" (to provide operating system like row selection including cmd/ctrl and shift select).
Default: none
Type: String
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"sRowSelect": "single"
		}
	} );
} );
sSelectedClass
Show details 		Set the class used to indicate that a row has been selected by the end user.
Default: DTTT_selected
Type: String
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"sRowSelect": "multi",
			"sSelectedClass": "row_selected"
		}
	} );
} );
sSwfPath
Show details 		Define the path of the SWF to be used by TableTools for copy to clipboard and saving a file locally operations. If you are having problems with these operations, but not printing, this is very likely to be the issue.
Default: media/swf/copy_csv_xls_pdf.swf
Type: String
Code example: 
$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"sSwfPath": "/swf/copy_csv_xls_pdf.swf"
		}
	} );
} );

Direct initialisation

TableTools can be initialised directly through the TableTools object, as well as through the DataTables sDom option. The TableTools constructor must be called with the keyword 'new' to create a new instance, and takes two parameters:

The example below shows how TableTools can be initialised in this manner. Note that you will need to insert the container element that TableTools created into the DOM manually, by using the TableToolsInstance.dom.container parameter. The example below shows this being inserted before the '#demo' element.

$(document).ready( function () {
	var oTable = $('#example').dataTable();
	var oTableTools = new TableTools( oTable, {
		"buttons": [
			"copy",
			"csv",
			"xls",
			"pdf",
			{ "type": "print", "buttonText": "Print me!" }
		]
	} );
	
	$('#demo').before( oTableTools.dom.container );
} );