buttons.dom.container

Since: Buttons 1.0.0

DOM configuration of the Buttons container element. Please note - this property requires the Buttons extension for DataTables.

Description

This option controls the HTML tag that is used for the element that contains the buttons that are created for the Buttons control.

Please refer to the buttons.dom documentation for an overview of the DOM structure that Buttons will create. In this specific case, this option controls the <div class="dt-buttons">...</div> that is shown in the example HTML there.

Type

object

Description:

Plain object which will can have the properties tag and / or className set.

  • tag - a string value which defines the HTML tag to use. There should be no spaces or any other formatting - e.g. it should simply be div, aside, etc.
  • className - a string value which defines the element's class name. Multiple classes can be given using space separation.

Examples

DataTables initialisation: Use an aside tag for the container display:

$('#myTable').DataTable( {
	buttons: {
		dom: {
			container: {
				tag: 'aside'
			}
		}
	}
} );

Instance initialisation: Use an aside tag for the container display:

new $.fn.dataTable.Buttons( table, {
	buttons: {
		dom: {
			container: {
				tag: 'aside'
			}
		}
	]
} );