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 and then used in the TableTools initialisation. Note that the TableTools.buttonBase object is extended with our required parameters - this base object provides default values for all of the options TableTools can work with, so they don't all have to be defined in our button.
Additional 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.
Rendering engine | Browser | Platform(s) | Engine version | CSS grade |
---|---|---|---|---|
Rendering engine | Browser | Platform(s) | Engine version | CSS grade |
Gecko | Firefox 1.5 | Win 98+ / OSX.2+ | 1.8 | A |
Gecko | Firefox 2.0 | Win 98+ / OSX.2+ | 1.8 | A |
Gecko | Firefox 3.0 | Win 2k+ / OSX.3+ | 1.9 | A |
Gecko | Camino 1.0 | OSX.2+ | 1.8 | A |
Gecko | Camino 1.5 | OSX.3+ | 1.8 | A |
Gecko | Netscape 7.2 | Win 95+ / Mac OS 8.6-9.2 | 1.7 | A |
Gecko | Netscape Browser 8 | Win 98SE+ | 1.7 | A |
Gecko | Netscape Navigator 9 | Win 98+ / OSX.2+ | 1.8 | A |
Gecko | Mozilla 1.0 | Win 95+ / OSX.1+ | 1 | A |
Gecko | Mozilla 1.1 | Win 95+ / OSX.1+ | 1.1 | A |
TableTools.BUTTONS.copy_to_div = $.extend( true, TableTools.buttonBase, { "sNewLine": "<br>", "sButtonText": "Copy to element", "sDiv": "", "fnClick": function( nButton, oConfig ) { document.getElementById(oConfig.sDiv).innerHTML = this.fnGetTableData(oConfig); } } ); $(document).ready( function () { $('#example').dataTable( { "sDom": 'T<"clear">lfrtip', "oTableTools": { "aButtons": [ { "sExtends": "copy_to_div", "sButtonText": "Copy to div", "sDiv": "copy", } ] } } ); } );