React Data GridDate Cell Editors

Two date cell editors are provided - agDateCellEditor for cell values provided as Date, and agDateStringCellEditor for date values provided as String.

Enabling Date Cell Editor

Edit any of the cells in the grid below to see the Date Cell Editor.

The Date Cell Editor is a simple date editor that uses the standard HTML date input and requires cell values to be of type Date.

Enabled with agDateCellEditor and configured with IDateCellEditorParams.

columnDefs: [
    {
        cellEditor: 'agDateCellEditor',
        cellEditorParams: {
            min: '2000-01-01',
            min: '2019-12-31',
        }
        // ...other props
    }
]

API Reference

Enabling Date as String Cell Editor

Edit any of the cells in the grid below to see the Date as String Cell Editor.

The Date as String Cell Editor is a simple date editor that uses the standard HTML date input. It's similar to the Date Cell Editor, but works off of cell values with type String.

The date format is controlled via Cell Data Types and the Date as String Data Type Definition. The default is 'yyyy-mm-dd'.

Enabled with agDateStringCellEditor and configured with IDateStringCellEditorParams.

columnDefs: [
    {
        cellEditor: 'agDateStringCellEditor',
        cellEditorParams: {
            min: '2000-01-01',
            min: '2019-12-31',
        }
        // ...other props
    }
]

API Reference

Next Up

Continue to the next section: Checkbox Cell Editor.