key-focus
KeyTable has focused a cell.
Please note - this property requires the KeyTable extension for DataTables.
Description
The key-focus event is triggered whenever KeyTable focuses on a cell. This can be the result of:
- Initialisation with a default focus (
keys.focus) - User interaction with the mouse (clicking on a cell)
- User interaction with the keyboard (moving focus)
- API focus (
cell().focus()).
It can be useful to know when a cell has focus so actions can be taken. For example, you may wish to show additional information about the cell, adjust the cell's styling or enable additional interaction options for the end user.
This event will occur after the key-blur event (if there is a cell to be blurred - i.e. two cells can never have focus at the same time).
Additionally, this event is not triggered on an already focused cell - i.e. a focused cell cannot gain focus again before losing it. See key-refocus for a suitable event if you need to know when focus is triggered on an already focused cell.
Type
function function( e, datatable, cell, originalEvent )
- Parameters:
Name Type Optional 1 eNo jQuery event object
2 datatableNo DataTable API instance for the table in question
3 cellNo A DataTables API instance that contains the cell that was focused (
cell())4 originalEventNo The original event that triggered this focus. It may be:
- A DOM
clickevent - e.g. click to focus on a cell - A DOM
focusevent - e.g. using tab to navigate around the page and tabbing into the table. null: no original event - e.g. when usingcell().focus().
- A DOM
Example
Show information about a cell when focus is changed:
var table = new DataTable('#myTable', {
keys: true
});
table
.on('key-focus', function (e, datatable, cell, originalEvent) {
var rowData = datatable.row(cell.index().row).data();
$('#details').html('Cell in ' + rowData[0] + ' focused');
})
.on('key-blur', function (e, datatable, cell) {
$('#details').html('No cell selected');
});Related
The following options are directly related and may also be useful in your application development.