Select

Select adds item selection capabilities to a DataTable. Items can be rows, columns or cells, which can be selected independently, or together. Item selection can be particularly useful in interactive tables where users can perform some action on the table, such as editing rows or marking items to perform an action on.

Item selection can be performed by the end user in one of three different modes:

  • Operating system (os) style - where a single click will select a single item only, deselecting any others that were previously selected, a shift click will select a range of items and a ctrl / cmd click will add and remove items from the selection.
  • Single item select (single) - only a single item can be selected at any one time. Any previously selected items will be deselected.
  • Multi-item selection (multi) - item selection is toggled with a single click.

It is also possible to select items through the DataTables API (rows().select(), columns().select() and cells().select()). The API integration also allows the select items to be easily obtained - see the API integration documentation for details.

Select also triggers a number of events letting you know when items have been selected and deselected, and has built-in button types for the Buttons extension allowing select all / none and other actions to be performed very easily. Please refer to the reference documentation for full details and the examples to see Select in operation.

Download

The easiest way to get and use Select is to use the DataTables download builder where you can select the software that you wish to use on your page and have a single Javascript and CSS file created and hosted for you.

Alternatively, the individual files can be included on your page, a release package downloaded or the source control repository cloned on GitHub.

Initialisation

If you include the Select extension on your page, it is automatically available for every DataTable on that page through the API - no additional initialisation is required. If you would like to make item selection possible for your end users through actions such as click and tap, the select option can be set to boolean true:

$('#myTable').DataTable( {
    select: true
} );

This will automatically enable the operating system style row selection. Other styles and item selection options, including which columns in the table will trigger item selection, can be enabled using the select option as an object. Please refer to the reference documentation for full details of the options available.

Features

Select adds the following features:

  • Select rows, columns and cells in a DataTable
  • Tight integration with DataTables' API
  • Full integration with the Buttons extension
  • Multiple selection styles
  • Checkbox column selection option
  • Fully internationalisable
  • Full integration with Bootstrap, Foundation and the other styling libraries supported by DataTables