1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
|
<?xml version="1.0" encoding="UTF-8" ?>
<dt-api group="columns">
<name>columns().footer()</name>
<summary>Get the footer nodes for the selected columns.</summary>
<since>1.10</since>
<type type="function">
<signature>columns().footer()</signature>
<description>Get the footer `dt-tag th` / `dt-tag td` cell for the selected columns.</description>
<returns type="DataTables.Api">DataTables API instance with header cells for the selected columns in the result set.</returns>
</type>
<description>
This method can be used to obtain (and therefore modify) the footer cells used for multiple columns. This may be made up of `dt-tag th` and / or `dt-tag td` elements depending on the HTML for your table.
The cells returned are the cells from the first row in the table `dt-tag tfoot` element relating to the selected columns. If you have multiple rows in the footer that you wish to manipulate you need to use the `dt-api table().footer()` method to obtain the table footer element and then use standard DOM / jQuery methods to manipulate the node.
Furthermore, the cells in the `dt-tag tfoot` may span multiple columns using `colspan` (they can also use `rowspan`, but again, only the cells in the first row will be available using this method). As such, a cell which uses `colspan` may belong to multiple columns.
Note that table footers are optional in DataTables. If the columns found from the `dt-api columns()` call do not have footer elements, an empty result set will be returned.
</description>
<example title="Sum all columns which have a class of `.sum` and put the sum into its footer cell"><![CDATA[
var table = $('#example').DataTable();
table.columns( '.sum' ).every( function () {
var sum = this
.data()
.reduce( function (a,b) {
return a + b;
} );
$( this.footer() ).html( 'Sum: '+sum );
} );
]]></example>
<related type="api">column().footer()</related>
</dt-api>
|