DataTables
New features in DataTables 1.9
As with previous major releases of DataTables, v1.9 builds upon what has gone before, providing enhancements for both yourselves as developers using DataTables and also end users. These changes will make working with DataTables more enjoyable than ever.
Major new features
-
$ API method:
Event initialisation | Row selection
When working with nodes in a DataTable you quickly become aware that filtering and paging will remove elements from the table, so you often have to work with fnGetNodes to get all elements in the table. This however is either flexible nor elegant - the new $ API method solves this problem. It takes the first parameter as a jQuery selector and applies that to the full table and returns a jQuery object of the resulting elements (for example oTable.$('tr') will get a list of all TR elements in the table).
The second parameter is optional and allows you to define what elements and ordering the table elements should be used in. The second parameter is an object that has the following options:- filter - "none" (default) or "applied". Restrict the nodes to the filtered rows or not.
- order - "current" (default) or "original". The order in which is the TR elements will be searched - the current sorting order or the order the data was read into DataTables.
- page - "all" (default) or "current". Query all TR nodes regardless of paging, or restrict to the current page.
-
Accessibility:
Zero configuration table
DataTables tables are now fully accessible and controllable by keyboard navigation and suitable markup and WAI-ARIA attributes are used for screenreaders. This works "out of the box" with no configuration required. To try it out, load any 1.9 example and press the tab key to navigate through the table controls. Note that this accessibility work as required updating the pagination elements. Please see the upgrade notes for further information. -
Settings defaults:
Setting defaults
Up until now it has not been possible to set the default values for DataTables initialisation options - 1.9 now offers that ability. All defaults can be accessed and modified through the $.fn.dataTable.defaults object, and all initialisation options can be set. This can be very useful for configuration tables in the same manner across a whole site / application. -
Documentation:
Automatically generated documentation
Documentation is fundamentally important to an open source project and while DataTables has long had solid documentation for initialisation options and API methods, the documentation has been tied to this site, not correctly versioned and the internal objects and properties have not been publically documented. With 1.9 DataTables is extensively commented for JSDoc and documentation can now be used offline, is included in the download package for that version and objects such as the settings object are fully documented.
Other features
-
File size:
Despite all of the new features in DataTables 1.9, a lot of work has been done to ensure that the minified file size is no larger than that of 1.8. In fact it is actually slightly smaller and is now little less than 70KB! -
State saving:
localStorage state saving
The state saving API has received a significant update making it much easier to work with. The details are explained in this blog post. -
Flexible table width:
Resizeable table
It can often be desirable to have the table resize dynamically as the browser window is resized. This used to be a bit complicated with DataTables due to the way that the table width was calculated, but now all you need to do is add a 'width' attribute to the table with a percentage value (i.e. width="100%"). -
Base stylesheets:
There are two new stylesheets in the DataTables distribution called jquery.dataTables.css and jquery.dataTables_themeroller.css. These stylesheets provide a baseline for the CSS framework to style a table without all the other CSS needed to run the demos. These core stylesheets should be used for new tables, as they provide a very flexible and simple baseline for you to work with. -
Internal structure:
A lot of work has been done to reorganise the internal structure of DataTables, while at the same time ensuring that the external API has not changed to allow full backwards compatibility. This will provide the base platform for future versions of DataTables which will allow much greater modularity. -
mDataProp types:
When using mDataProp as a function, it will now give you a second parameter - the use of the data being requested. This will be 'display', 'sort', 'filter' or 'type' and allows you to return different results for the different uses of the data. For example you might which to sort a telephone number column as an integer, but display it formatted and allow filtering either as an integer or in the formatted form. -
fnCreatedCell column option:
The fnRender column option is very useful for manipulating the data that is displayed in a cell, but the TD element for the cell might not be available when fnRender is called, which can make adding classes or any other manipulation of the element quite difficult. The new fnCreatedCell column option compliments fnRender but in this case allows access to the cell for manipulation. -
Case sensitive filtering:
By default DataTables has always done case-insensitive filtering, which is now a configurable option. Using the bCaseInsensitive initialisation option or the 6th parameter of fnFilter. -
Sorting optimisations:
Sorting performance has been improved by preparing the data to be sorted before doing the sort itself. For example, it is pointless doing .toLowerCase() on the same string multiple times - it will always result in the same result. As such sorting functions may now have a {type}-pre method as well as the {type}-desc and {type}-asc methods to prepare the data. All the internal sorting methods now use this method. -
Default multi-column sorting:
Previously it was possible to use iDataSort to have DataTables sort a given column based on the data in a different column - however this was restricted to a single column. With 1.9 is it now possible to use the aDataSort option to sort a column based on the data in multiple columns when the user activates the sort on that column. This is useful in cases such as tables with first name and last name in different columns. -
Column definition API methods for plug-in developers:
DataTables provides the aoColumns and aoColumnDefs options for configuring column options in DataTables, and this can now also be utilised by plug-in developers to provide this same functionality using the _fnApplyColumnDefs method. -
fnIsOpen API method:
To compliment fnOpen and fnClose there is now also a fnIsOpen API method which checks to see if a given row is "open" or not.
Deprecated methods
- Using sName to order columns with server-side processing or Ajax sourced data is now deprecated and will be removed in the next major version of DataTables. The mDataProp option introduced in v1.8 offers much greater flexibility and should be used in preference to sName reordering. The sName parameter will remain to reference columns.
There are a wide range of bug fixes and internal updates as well as all of these new features. To read the full release notes, please check the release notes.