columns().every()
Iterate over each selected column, with the function context set to be the column in question.
Description
A typical operation with the DataTable API is to perform an operation on a collection of columns - a common action is performed on each column, adding event handlers, updating data, etc. This iteration of the columns can be performed a number of ways in DataTables, each with its own advantages:
This columns().every()
method is likely to be the most useful in the majority of cases as it sets the context of the callback function to be the column()
instance for the column in question (normally a callback in the DataTables API has its context set to be at the top level API hierarchy). In simple terms this means you have the methods such as column().data()
available as this.data()
in the callback given to this method.
Consider the following example using each()
, which iterates over the column indexes that have been selected - we are required to get the column()
object for each column to be able to work with it directly:
table.columns().eq(0).each( function ( index ) {
var column = table.column( index );
var data = column.data();
// ... do something with data(), or column.nodes(), etc
} );
Using columns().every()
this can be rewritten as:
table.columns().every( function () {
var data = this.data();
// ... do something with data(), or this.nodes(), etc
} );
Although a relatively simple optimisation in terms of code presentation, it can make the code much more readable and intuitive. It is also significantly more performant as of DataTables 2, as API instances do not need to create created every time around the loop.
The other advantage is that the table context is automatically handled - in the first example above where each()
is used, the eq()
method is used to select the information from the first table in the API's context only, introducing complexity if multiple tables are used. In columns().every()
the table context is automatically set to the appropriate table for each column that has been selected.
Type
function columns().every( fn )
- Description:
Iterate over each selected columns
- Parameters:
Name Type Optional 1 fn
No Function to execute for every column selected. The function's content is set to be an API instance for the column in question.
As of DataTables 1.10.8 the function is passed the following parameters:
- Column index
- Table loop counter
- Column loop counter
No return value is expected or acted upon.
- Returns:
DataTables API instance of the selected columns.
Examples
Add a filter for each column in the table to the footer:
var table = new DataTable('#myTable');
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
that.search(this.value).draw();
});
});
Build a search for each column with a select-filter
class.:
var table = new DataTable('#myTable');
table.columns('.select-filter').every(function () {
var that = this;
// Create the select list and search operation
var select = $('<select />')
.appendTo(this.footer())
.on('change', function () {
that.search($(this).val()).draw();
});
// Get the search data for the first column and add to the select list
this.cache('search')
.sort()
.unique()
.each(function (d) {
select.append($('<option value="' + d + '">' + d + '</option>'));
});
});
Sum all columns which have a class of .sum
and put the sum into its footer cell:
var table = new DataTable('#myTable');
table.columns('.sum').every(function () {
var sum = this.data().reduce(function (a, b) {
return a + b;
});
$(el).html('Sum: ' + sum);
});
Related
The following options are directly related and may also be useful in your application development.