API plug-ins

One of the most common interactions with DataTables for a developer (other than initialisation of the table of course!) is to make use of the API methods provided. While allowing for an extensive range of code interactions, the default API can be greatly enhanced by making use of the functions provided below, as suitable for your application.

How to use

To make use of one of the plug-in API functions below, you simply need to include it in the Javascript available for your page, after you load the DataTables library, but before you initialise the DataTable. If you are using multiple plug-in methods, ensure that you combine them into a single file to improve performance.

After that, you will be able to initialise the table, and call the function on the resulting object. As an example the code below makes use of sum() saved into a file:

<script type="text/javascript" src="jquery.dataTables.js"></script>
<script type="text/javascript" src="sum().js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var table = $('#example').DataTable();
         
        $('#button').click( function () {
            alert( 'Column 4 total: '+table.column(4).data().sum() );
        } );
    } );
</script>

For more information on using the DataTables API, please refer to the API section of the manual. Additionally, a live example of an API plug-in being used is available in the examples section.

Plug-in methods


average()	Average the values in a data set.
column().title()	Get the title of a column
columns().order()	Apply multi-column ordering through the columns() API method.
order.neutral()	Change ordering of the table to its data load order
page.jumpToData()	Jump to a page by searching for data from a column
processing()	Show / hide the processing indicator via the API
row().show()	See the row in datable by display the right pagination page
rows().generate()	Create tr elements for rows which have not yet had their nodes created.
sum()	Sum the values in a data set.

Legacy plug-ins

The following API plug-ins are designed for use with DataTables 1.9 and earlier. Although they will operate with DataTables 1.10, they use the 1.9 style API rather than the new chaining API of 1.10. Also, many of the legacy plug-ins have been integrated directly into DataTables 1.10's core API (for example fnReloadAjax's functionality is provided by ajax.reload() now.

Using legacy plug-ins

Usage of the legacy plug-ins is very similar to the above, but note the DataTables constructor uses a lowercase d.

<script type="text/javascript" src="jquery.dataTables.js"></script>
<script type="text/javascript" src="dataTables.fnGetHiddenNodes.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var table = $('#example').dataTable();
         
        $('#button').click( function () {
            var hidden = table.fnGetHiddenNodes();
            alert( hidden.length +' nodes were returned' );
        } );
    } );
</script>

Legacy methods


fnAddDataAndDisplay	Add data and shift the paging to display it immediately
fnAddTr	Add a `dt-tag tr` element to the table
fnColumnIndexToVisible	Convert a column data index to a visible index.
fnDataUpdate	Update DataTables cached data from the DOM
fnDisplayRow	Shift the table's paging to display a given `dt-tag tr` element
fnDisplayStart	Change the table's paging display start.
fnFakeRowspan	Create a rowspan for cells which share data
fnFilterAll	Apply a common filter to all DataTables on a page
fnFilterClear	Remove all column and global filters applied to a table
fnFilterOnReturn	Require the return key to be pressed to filter a table
fnFindCellRowIndexes	Search for data, returning row indexes
fnFindCellRowNodes	Search for data, returning row nodes
fnGetAdjacentTr	Get the adjacent `dt-tag tr` element for a row.
fnGetColumnData	Get the data from a column
fnGetColumnIndex	Get the column index by searching the column titles
fnGetHiddenNodes	Get the `dt-tag tr` elements which are not in the DOM
fnGetTd	Get the `dt-tag td` element for a cell.
fnGetTds	Get the `dt-tag td` elements for a row
fnLengthChange	Change the paging display length
fnMultiFilter	Apply multiple column filters together
fnPagingInfo	Get information about the paging state of the table
fnProcessingIndicator	Show and hide the DataTables processing element through the API.
fnReloadAjax	Reload the table's data from the Ajax source
fnSetFilteringDelay	Add a key debouce delay to the global filtering input of a table
fnSortNeutral	Change ordering of the table to its data load order
fnStandingRedraw	Redraw the table without altering the paging
fnVisibleToColumnIndex	Convert a column visible index to a data index.