searchPanes.panes

Since: SearchPanes 1.0.0

Define custom panes to filter across all columns.
Please note - this property requires the SearchPanes extension for DataTables.

Description

As standard, SearchPanes will not add any custom panes to the page.

It operates in a similair way to the options array in columns.searchPanes.options. With the addition of a header property to hold the title of the pane.

This is useful when you want to make searches across columns. Technically this would be possible by just adding an option to an already existing Pane but that may confuse the end user as they may think the option only applied to the corresponding column and not the table as a whole.

Type

array

Description:: The searchPanes.panes array contains object defining each pane. Each object contains a header property which holds the title of the pane. There is also an options array in the same form as columns.searchPanes.options. It is also possible to defined dtOpts and custom classes within the object. See columns.searchPanes.dtOpts and columns.searchPanes.className for details on these.

Default

Value: undefined

The default value of searchPanes.panes is undefined. If there are no custom panes defined then none will be added.

Example

Define custom pane::

new DataTable('#myTable', {
	layout: {
		top1: {
			searchPanes: {
				panes: [
					{
						header: 'custom',
						options: [
							{
								label: 'Accountants in Tokyo',
								value: function (rowData, rowIdx) {
									return rowData[2] === 'Accountant' && rowData[3] === 'Tokyo';
								}
							}
						]
					}
				]
			}
		}
	}
});

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

Options