select.headerCheckbox

Since: Select 2.0.0

Control automatic addition of header checkbox.
Please note - this property requires the Select extension for DataTables.

Description

If you use the DataTable.render.checkbox rendering function (which is part of the Select extension) to provide a checkbox column in the DataTable, Select will automatically insert a checkbox into the header that provides the ability to summarise the current selection state and to easily select / deselect all rows to the end user. This option can be used to disable the checkbox, which might be of particular interest if you are using server-side processing in DataTables (serverSide), since item selection is a client-side concept in Select (i.e. you can only select the rows that are available on the client-side - i.e. select-page).

The "select all" action of the checkbox will select all rows in the current search set of the DataTable - i.e. if a row has been removed due to a search term, it will not be selected. However, the "deselect all" action will result in all rows being deselected, regardless of if they are filtered out or not by the applied search.

Similarly, the header checkbox will show as checked if all rows in the current search set of the DataTable are checked. If no rows are selected at all it will show unchecked. Otherwise, it will show in its "intermediate" state.

Types

boolean

Description:

When enabled, any column which uses the DataTable.render.checkbox() renderer provided by Select will have a global checkbox added to its header cell.

Please note that when using server-side processing this option will work in the same manner as if it were set to select-page - i.e. only rows on the currently visible page can be selected.

string

Description:

Since Select 2.0.2 this option can also be given as a string, where it can take one of the following values:

none - disable the header checkbox (the same as setting this value to false)
select-all - select all rows in the table (the same as setting this value to true)
select-page - select all rows in current page (only the visible rows).

Default

Value: true

Examples

Disable the header checkbox addition:

new DataTable('#example', {
	columnDefs: [
		{
			orderable: false,
			render: DataTable.render.select(),
			targets: 0
		}
	],
	select: {
		style: 'os',
		selector: 'td:first-child',
		headerCheckbox: false
	},
	order: [[1, 'asc']]
});

Enable the header checkbox addition and make it select only the rows on the current page:

new DataTable('#example', {
	columnDefs: [
		{
			orderable: false,
			render: DataTable.render.select(),
			targets: 0
		}
	],
	select: {
		style: 'multi',
		selector: 'td:first-child',
		headerCheckbox: 'select-page'
	},
	order: [[1, 'asc']]
});