{hero}

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

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
				}
			]
		}
	}
});