spacer
A special "button" which provides visual grouping between buttons.
Please note - this property requires the Buttons extension for DataTables.
Description
This button type is unique in Buttons in that it doesn't actually display a button or anything the end user can interact with. Rather it simply introduces a space between buttons, allowing easy visual grouping.
As a result the majority of options such as action
, init
and so on do not apply to this button. Only the options specified below are available.
Options
This button can have the following options set in its configuration object to customise its actions and display, in addition to those options which are available for all buttons (e.g. buttons.buttons.text
):
style
- Type:
string
- Default:
empty
This option can be set to:
empty
: No background or border is shown - i.e. the spacing element is fully transparent.bar
: A 1 pixel bar is shown.
Typically the bar
option would not be used with a text value as well.
text
- Type:
string
- Default:
Empty string
The button's display text. The text can be configured using this option (see buttons.buttons.text
) or the buttons.spacer
option of the DataTables language
object. if specified it can be used to group options with a visual title, which is particularly effective inside collections.
Examples
Add a spacer between buttons:
new DataTable('#myTable', {
layout: {
topStart: {
buttons: ['csv', 'excel', 'pdf', 'spacer', 'copy', 'print']
}
}
});
Show with a bar:
new DataTable('#myTable', {
layout: {
topStart: {
buttons: [
'csv',
'excel',
'pdf',
{
extend: 'spacer',
style: 'bar'
},
'copy',
'print'
]
}
}
});