Cell Editors

AdapTable provides 2 Cell Editors - numeric and date - to enable quick data entry and edits.

caution

If a bespoke Cell Editor is provided in GridOptions then that will take preference and be used instead

These Cell Editors are automatically created by AdapTable when a cell of the relevant data-type is being edited.

important

This includes the Free Text Column Module where a Cell Editor corresponding to the DataType of the Free Text Column will be provided

Numeric Cell Editor

The Numeric Cell Editor is used, by default in AdapTable, when editing all numeric Columns.

note

A numeric column is one where the ColumnType is set to abColDefNumber

It displays an editor with arrows at the end to move up and down and only accepts numbers (with fractions).

Configuration

The Numeric Cell Editor is configured by specifying cellEditorParams in the AG Grid Column Definition.

There are 2 configurable properties:

  • showClearButton - whether to show the Clear button in the Editor

    note

    If set to true (the default value), it works together with cellEditorParams.emptyValue

  • emptyValue - value to set for cell when Clear button is pressed - defaults to '' (empty string)

colDef {
field: 'stars',
type: 'abColDefNumber',
cellEditorParams: {
emptyValue: 5,
showClearButton: false
}
}
important

If the Column Definition in AG Grid has a valueParser (provided as a function), that will be invoked before setting the value for the cell.

Date Cell Editor

The Date Cell Editor is used, by default in AdapTable, when editing all datetime Columns.

note

A datetime column is one where the ColumnType is set to abColDefDate

It displays the AdapTable Date Picker - the style of which is heavily customisable via CSS variables.

tip

The Date Picker can itself also be configured - see Date Input Options for more details

Configuration

The Date Cell Editor is configured by specifying cellEditorParams in the AG Grid Column Definition.

There is just 1 configurable property:

  • showClearButton - whether to show the Clear button (defaults to false)
colDef {
field: 'tradeDate',
type: 'abColDefDate',
cellEditorParams: {
showClearButton: false
}
}
important

If the Column Definition in AG Grid has a valueParser (provided as a function), that will be invoked before setting the value for the cell.

This is useful because dates can be stored as strings, numbers or Date instances - the value parser will be called with a Date instance

caution

It's your responsibility to transform that value to whatever format you want to use for persisting it to the grid

tip

We strongly recommend you specify a colDef.valueParser function