{hero}

keys.editorKeys

Since: KeyTable KeyTable 2.1.3

Enable or disable navigation while inline editing.
Please note - this property requires the KeyTable extension for DataTables.

Description

When using KeyTable with Editor to provide an Excel like inline editing experience for the end user, you may wish to control the behaviour of the arrow keys. There are currently two options KeyTable supports:

  • navigation-only - like Excel the current cell will be blurred and the focus moved per the arrow keys.
  • tab-only - more like what might be expected on the web - the arrow keys move the cursor through the text box. Tab can be used to move between cells.

The behaviour you might wish to use can be configured through this option. For applications where end users are used to Excel's behaviour you might wish to use the default, while for more general use the tab-only option might be appropriate.

Type

string

Description:

Define behaviour of navigation to follow when inline editing:

  • navigation-only - arrow keys will move the focused cell, causing the current cell to loose focus. Tab and return key are also active.
  • tab-only - tab key can be used to move to the next / previous fields and return to submit the current field, but the arrow keys are ignored by KeyTable, allowing the arrow keys to be used to navigate in the text box in the cell.

Default

  • Value: navigation-only

Navigation is allowed and the current cell will be blurred when arrow keys are used.

Example

Allow the arrow keys to perform navigation in the text box rather than the table when inline editing is active.:

$('#myTable').DataTable( {
	keys: {
		editor: editor,
		editorKeys: 'tab-only'
	}
} );

Related

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