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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
<?xml version="1.0" encoding="UTF-8" ?>
<dt-api group="cells">
<name>cell().data()</name>
<summary>Get / set data for the selected cell</summary>
<since>1.10</since>
<type type="function">
<signature>cell().data()</signature>
<description>Get the data for the selected cell</description>
<returns type="*">Data from the cell</returns>
</type>
<type type="function">
<signature>cell().data( set )</signature>
<description>Set the data for the selected cell</description>
<parameter type="*" name="set">
Value to assign to the data for the cell
</parameter>
<returns type="DataTables.Api">DataTables API instance with selected cell as the result set</returns>
</type>
<description>
This method is used to work with the data in the cell retrieved by the selector used in the `dt-api cell()` call. It can be used to get the existing data, or set a new value.
Note that when used as a setter, this method sets the data to apply to the table, storing it in the data source array or object for the row, but does not update the table's internal caches of the data (i.e. the search and order cache) until the `dt-api draw()` method is called. The draw can be triggered as a chained method of the `dt-api cell().data()` method's returned object - for example `table.cell( 0, 0 ).data( 'Updated' ).draw();`.
Moreover, although the internal cache is not updated until the next draw, the change to the cell's content is visible immediately upon calling this method as a setter, as it writes to the cell's content using `innerHTML`.
</description>
<example title="Alert the data from a cell when it is clicked upon"><![CDATA[
var table = $('#example').DataTable();
$('#example tbody').on( 'click', 'td', function () {
alert( table.cell( this ).data() );
} );
]]></example>
<example title="Increment the data in a cell by 1 when clicked upon"><![CDATA[
var table = $('#example').DataTable();
$('#example tbody').on( 'click', 'td', function () {
var cell = table.cell( this );
cell.data( cell.data() + 1 ).draw();
// note - call draw() to update the table's draw state with the new data
} );
]]></example>
<related type="api">cells().cache()</related>
<related type="api">cells().data()</related>
<related type="api">cells().render()</related>
<related type="api">cell().cache()</related>
<related type="api">cell().render()</related>
</dt-api>
|
