Preamble

Plug-ins in TableTools take the form of additional buttons types, which provide extra options and flexibility for TableTools. This example shows how a plug-in button type can be defined then used in the TableTools initialisation. Plug-ins for TableTools can be found on the DataTables.net site. The example plug-in here shows a button which is used to insert the data from the table into a given element.

Live example

Initialisation code

TableTools.BUTTONS.copy_to_div = {
	"sAction": "text",
	"sFieldBoundary": "",
	"sFieldSeperator": "\t",
	"sNewLine": "<br>",
	"sToolTip": "",
	"sButtonClass": "DTTT_button_text",
	"sButtonClassHover": "DTTT_button_text_hover",
	"sButtonText": "Copy to element",
	"mColumns": "all",
	"bHeader": true,
	"bFooter": true,
	"sDiv": "",
	"fnMouseover": null,
	"fnMouseout": null,
	"fnClick": function( nButton, oConfig ) {
		document.getElementById(oConfig.sDiv).innerHTML = 
			this.fnGetTableData(oConfig);
	},
	"fnSelect": null,
	"fnComplete": null,
	"fnInit": null
};

$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'T<"clear">lfrtip',
		"oTableTools": {
			"aButtons": [
				{
					"sExtends":    "copy_to_div",
					"sButtonText": "Copy to div",
					"sDiv":        "copy",
				}
			]
		}
	} );
} );

Other examples

• Basic initialisation
• Setting the SWF path
• Custom button arrangement
• Button text alteration
• Using button collections
• Using jQuery UI themes
• Styling with Twitter Bootstrap
• Multiple TableTools toolbars for a single table
• Multiple DataTables with a single initialisation
• User selectable rows (multiple rows)
• User selectable rows (single row)
• Alternative initialisation using 'new TableTools()'
• Altering the TableTools defaults
• TableTools plug-in buttons
• Customising the PDF output (adding text and orientation)