headerCallback

Since: DataTables 1.10

Header display callback function.

Description

This function is called on every 'draw' event (i.e. when a filter, sort or page event is initiated by the end user or the API), and allows you to dynamically modify the header row. This can be used to calculate and display useful information about the table.

Type

function headerCallback( thead, data, start, end, display )

Parameters:

	Name	Type	Optional
1	`thead`	`node`	No
	`THEAD` element of the table's header
2	`data`	`array`	No
	Full data array of the table. Note that this is in data index order. Use the `display` parameter for the current display order.
3	`start`	`integer`	No
	Index for the current display starting point in the display array
4	`end`	`integer`	No
	Index for the current display ending point in the display array
5	`display`	`array`	No
	Index array to translate the visual position to the full data array

Example

Show information about the records being displayed:

new DataTable('#myTable', {
	headerCallback: function (thead, data, start, end, display) {
		$(thead)
			.find('th')
			.eq(0)
			.html('Displaying ' + (end - start) + ' records');
	}
});

The following options are directly related and may also be useful in your application development.

API

Options

headerCallback

Description

Type

function headerCallback( thead, data, start, end, display )

Example

Related

DataTables