buttons.dom.collection

Since: Buttons 1.0.0

DOM configuration of the collection display.
Please note - this property requires the Buttons extension for DataTables.

Description

This option controls the HTML tag that is used for the element that is displayed when a collection button is triggered. It in turn contains the sub-buttons of the collection.

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-button-collection">...</div> tag 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 collection display:

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

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

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