columnsVisibility

Since: Buttons 1.0.0

A set of Buttons to set the visibility of individual columns.
Please note - this property requires the Buttons extension for DataTables.

Description

This button type actually creates multiple buttons in a Button instance, one button for each column that has been selected (or all columns if no selector is given). Each button is automatically given the same title as the header text for that column, and gives the ability to control the visibility of each column through the button's visibility option.

This button type is included for completeness in the base set of column visibility buttons, but the columnsToggle and columnVisibility are generally more likely to be useful.

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):

`columns`

Type: column-selector
Default: undefined

Columns selector that defines the columns to include in the column visibility button set. By default this is undefined which results in all columns being selected, but any of the column-selector options can be used to define a custom button set.

`visibility`

Type: boolean
Default: undefined

Control if the columns should be shown or hidden when the button is activated.

Example

DataTables initialisation: Individual button collections to show / hide columns:

new DataTable('#myTable', {
	layout: {
		topStart: {
			buttons: [
				{
					extend: 'collection',
					text: 'Show columns',
					buttons: ['columnsVisibility'],
					visibility: true
				},
				{
					extend: 'collection',
					text: 'Hide columns',
					buttons: ['columnsVisibility'],
					visibility: false
				}
			]
		}
	}
});