gentelella/production/js/datatables/tools/examples/plug-in.xml

<?xml version="1.0" encoding="UTF-8" ?>
<dt-example table-type="html" order="12">

<css lib="datatables tabletools" />
<js lib="jquery datatables tabletools">
<![CDATA[

$.fn.dataTable.TableTools.buttons.copy_to_div = $.extend(
	true,
	{},
	$.fn.dataTable.TableTools.buttonBase,
	{
		"sNewLine":    "<br>",
		"sButtonText": "Copy to element",
		"target":      "",
		"fnClick": function( button, conf ) {
			$(conf.target).html( this.fnGetTableData(conf) );
		}
	}
);


$(document).ready(function() {
	$('#example').DataTable( {
		dom: 'T<"clear">lfrtip',
		tableTools: {
			"aButtons": [ {
				"sExtends":    "copy_to_div",
				"sButtonText": "Copy to HTML",
				"target":      "#copy"
			} ]
		}
	} );
} );
]]>
</js>

<title lib="TableTools">Plug-in button types</title>

<info><![CDATA[

This example shows now a plug-in button type can be created for TableTools. Button types are attached to the `$.fn.dataTable.TableTools.buttons` object and extend `$.fn.dataTable.TableTools.buttonBase`. All of the [button options defined in the documentation](//datatables.net/extensions/tabletools/button_options) are available and can be overridden as required. Finally to use the button simply include its name in the `aButtons` array or use it as a button extender (`sExtends`).

This example shows a button which will simply get the data contents of a table and set that as the contents of another element.

]]></info>

<demo-html>
	<div id="copy" class="box" style="height: 100px; overflow: auto">
		Copy output will go here
	</div>
</demo-html>

</dt-example>