datatables.net-buttons-bs4
Version:
Buttons for DataTables with styling for [Bootstrap4](https://getbootstrap.com/docs/4.6/getting-started/introduction/)
71 lines (63 loc) • 1.55 kB
JavaScript
/*! Bootstrap integration for DataTables' Buttons
* © SpryMedia Ltd - datatables.net/license
*/
import jQuery from 'jquery';
import DataTable from 'datatables.net-bs4';
import Buttons from 'datatables.net-buttons';
// Allow reassignment of the $ variable
let $ = jQuery;
$.extend(true, DataTable.Buttons.defaults, {
dom: {
container: {
className: 'dt-buttons btn-group flex-wrap'
},
button: {
className: 'btn btn-secondary',
active: 'active',
dropHtml: '',
dropClass: 'dropdown-toggle'
},
collection: {
container: {
tag: 'div',
className: 'dropdown-menu dt-button-collection'
},
closeButton: false,
button: {
tag: 'a',
className: 'dt-button dropdown-item',
active: 'dt-button-active',
disabled: 'disabled',
spacer: {
className: 'dropdown-divider',
tag: 'hr'
}
}
},
split: {
action: {
tag: 'a',
className: 'btn btn-secondary dt-button-split-drop-button',
closeButton: false
},
dropdown: {
tag: 'button',
className:
'btn btn-secondary dt-button-split-drop dropdown-toggle-split',
closeButton: false,
align: 'split-left',
splitAlignClass: 'dt-button-split-left'
},
wrapper: {
tag: 'div',
className: 'dt-button-split btn-group',
closeButton: false
}
}
},
buttonCreated: function (config, button) {
return config.buttons ? $('<div class="btn-group"/>').append(button) : button;
}
});
DataTable.ext.buttons.collection.rightAlignClassName = 'dropdown-menu-right';
export default DataTable;