DataTables logo DataTables

This site contains the legacy documentation for DataTables v1.9 and earlier for reference only.
DataTables 1.10 is the current release and is now available.

Styling information

The key to styling DataTables is the 'id' attribute that you give the table in question. Any HTML added to the page will have this id with a postfix (e.g. _info). The following ID's and classes will be applied:

Feature ID Class
Processing indicator *_processing dataTables_processing
Information: By default inserted before the table (can be changed by using the sDom parameter).
Change display length *_length dataTables_length
Information: By default inserted before the table (can be changed by using the sDom parameter).
Filter *_filter dataTables_filter
Information: By default inserted before the table (can be changed by using the sDom parameter).
Pagination *_paginate dataTables_paginate
Information: By default inserted after the table (can be changed by using the sDom parameter).
Pagination *_previous paginate_disabled_previous
paginate_enabled_previous
Pagination *_next paginate_disabled_next
paginate_enabled_next
Display information *_info dataTables_info
Information: By default inserted after the table (can be changed by using the sDom parameter).
Sorting (headers) sorting_asc
sorting_desc
Information: Applied to the TH in the table header
Sorting (columns) sorting_1
sorting_2
sorting_3
Information: Applied to the TD's in the column which is being sorted upon. The '_1', '_2' and '_3' prefix is applied for multi-column sorting in priority order.
General *_wrapper dataTables_wrapper
Information: General wrapper div element around the table
Zero records found cell dataTables_empty
Information: This class name is applied to the table cell which reports that 'zero records' have been found. This cell is dynamically created by DataTables, so this class is applied to allow extra styling.