key-prefocus
.
Please note - this property requires the KeyTable extension for DataTables.
Description
This event is triggered just prior to KeyTable blurring focus from the current cell (if there is one focused) and then focusing on a new cell. It is provided to give a way of cancelled a focus, before KeyTable performs any interaction changes with the table.
To cancel the focus action, return false from your key-prefocus event handler. Since it is a Javascript function you can perform checks to determine what value should be returned (note no return statement, i.e. undefined will not result in the focus being cancelled), including checking values in the row for the cell that was clicked upon.
As noted, this event happens before KeyTable would blur a cell which currently has focus, so if you want to cancel the focus and blur from the currently focused cell, you must call cell.blur().
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 is to be 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
Examples
Disallow focus on any cell that doesn't meet a condition.:
var table = new DataTable('#myTable', {
keys: true
});
table.on('key-prefocus', function (e, dt, cell, currentCell, org) {
let row = dt.row(cell.index().row).data();
return row.fruit === 'Apple' ? false : true;
});As above, but blur focus when disallowed.:
var table = new DataTable('#myTable', {
keys: true
});
table.on('key-prefocus', function (e, dt, cell, org) {
let row = dt.row(cell.index().row).data();
if (row.fruit === 'Apple') {
// Blur current focus
dt.cell.blur();
return false;
}
});Related
The following options are directly related and may also be useful in your application development.