Since: DataTables 1.10

Get / set data for the selected cell.


This method is used to work with the data in the cell retrieved by the selector used in the 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 draw() method is called. The draw can be triggered as a chained method of the 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.


function cell().data()


Get the data for the selected cell



Data from the cell

function cell().data( set )


Set the data for the selected cell


DataTables API instance with selected cell as the result set


Alert the data from a cell when it is clicked upon:

var table = $('#example').DataTable();

$('#example tbody').on( 'click', 'td', function () {
	alert( table.cell( this ).data() );
} );

Increment the data in a cell by 1 when clicked upon:

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
} );


The following options are directly related and may also be useful in your application development.