SYIDAX / DATA GRID

Cell and row editing

Start editing by double-clicking a cell or using the keyboard.

Get started
Cell and row editingSample order data
120 rows
Loading Grid…

Options

Changes below update the Grid and code immediately.

Latest result

Double-click a Quantity cell and enter the desired number.

View code
Current preview

Usage guide

#

Edit quantities and statuses directly in the table. Assign suitable editors, such as numeric inputs or selection lists, per column.

Try it yourself

  1. Start quantity editing

    Double-click a Quantity cell and enter the desired number.

  2. Apply or cancel

    Press Enter to apply. Start another edit and press Escape to cancel it.

  3. Compare editor types

    Edit Status and choose In progress, Complete, or Under review. Values are selected differently from numeric quantities.

Expected results

Edited and calculated cells update. Inspect previous and new values in cellValueChanged.

Order ID and Total are not directly editable in this example. Successful editing changes browser data; connect server saving separately.

Useful terms

editable
A setting determining whether users can edit a cell.
editor
The editing UI type, such as a numeric input or selection list.

API reference

#

Other properties1
Attribute / PropertyType / DefaultDescription
editType
'cell' | 'fullRow'Default: 'cell'PE-ROWEDIT-WIRING-01 — AG's `editType`. Under `'fullRow'` the ROW is the transaction: opening any editor on a data row opens the session, every editor commit STAGES its cell into it (no write, no per-cell event yet), and the row commits atomically — grid-level Enter on the session's row, editing a DIFFERENT row (blur-policy commit), or `stopRowEdit('commit')`. Grid-level Escape on the session's row cancels the whole row with zero writes. Editors paint one cell at a time (the row is the transaction, not a simultaneous paint — the recorded v1 scope).
Events6
EventsDetail typeDescription
GridCellEditingRequestedDetailFires when editing is requested for an editable cell.
GridCellEditingCancelledDetailFires when active edit mode is cancelled.
GridCellEditingCommittedDetailFires when an active edit transaction commits.
SyGridRowValueChangedEventDetailexactly once per COMMITTED row-edit stop .
SyGridRowEditStartEventDetailADR-024 — a row session opened (interactive entry or the API).
SyGridRowEditStopEventDetailADR-024 — the session resolved (committed / cancelled / rejected), once per stop.
Methods7
Method / ArgumentsReturn typeDescription
rowId: GridRowId
Promise<boolean>open a full-row edit session for a DISPLAYED data row resolved by stable id. Editable columns = resolved column defs with `editable: true` (the grid's structural editability — the same gate every interactive edit path uses). Group markers, detail panels and unloaded placeholder rows carry no stable data id, so they cannot reach this API; the boundary table still guards them in-core.
reason?: 'commit' | 'cancel'
Promise<SyGridRowEditReport>stop the live row edit. `'commit'` (default) routes through the core's `'api'` commit row; `'cancel'` through the `'escape'` cancel row . A committed stop applies its writes through the single-authority route, then emits `rowValueChanged` exactly once AFTER the per-cell events . A rejected stop keeps the session open with pending intact (the recovery law).
colId: string, value: unknown
Promise<boolean>ADR-024 — stage ONE cell value into the live row session (the public half PE-ROWEDIT-01 recorded missing: start/stop existed, nothing could put writes in). Refusals are the core's own (`no-row-edit`, `column-not-editable`) and stage NOTHING. The write itself lands at the row commit through the single-authority route — staging emits no event.
Promise<EditTransaction | null>Read the active edit transaction.
Promise<boolean>Commit the active edit transaction.
Promise<boolean>Cancel the active edit transaction.
Promise< GridMountedComponentLookup< GridEditorInstance<GridData, unknown, unknown>, GridEditorParams<GridData, unknown, unknown>, HTMLElement > | null >Return the active lifecycle editor lookup, including its generation.
ColumnDef17
ColumnDefType / RequiredDescription
PRO OPTION
GridCellEditorDeclaration<TData, TValue, TContext>OptionalNamed or direct lifecycle editor. Built-in editors continue to use `editor`.
booleanOptionalWhether cells in this column can be edited.
PRO OPTION
'text' | 'number' | 'date' | 'select' | 'checkbox' | 'textarea' | 'autocomplete' | 'largeText'OptionalBuilt-in editor type.
GridCallback<[ValueParserParams<TData, TValue, TContext>], TValue>OptionalArc review 239-242 — parse a clipboard-pasted display string into THIS column's cell value (AG `valueParser` parity). When present it fully replaces the built-in auto-detection (`detectPastedValue`); a throw falls back to the raw string. `editor: 'text'` columns skip auto-detection even without a parser (identifiers stay strings).
GridCallback< [ValueSetterParams<TData, TValue, TContext>], boolean | void >OptionalOptional host-owned write path. Return false to reject the edit. A true or void result accepts the mutation; the callback must apply `newValue` synchronously so transaction/event/audit/undo surfaces observe one value.
ReadonlyArray<{ value: unknown; label: string; disabled?: boolean }>OptionalOption list for `editor: 'select'`.
number | Date | stringOptionalInclusive lower bound for number/date editors.
number | Date | stringOptionalInclusive upper bound for number/date editors.
numberOptionalMultiple-of-step constraint for number editors.
numberOptionalDisplay formatting hint for number editors.
booleanOptionalWhen true, an empty number/date editor commits as `null`.
booleanOptionalSelect a name to inspect its type contract.
'date' | 'iso'OptionalCommit shape for date editors.
numberOptionalInitial visible rows for textarea editors.
numberOptionalAuto-grow cap for textarea editors.
numberOptionalVisible columns (character width) for the large-text popup editor.
numberOptionalMax character length for the large-text popup editor. New input is capped here (ag-grid `agLargeTextCellEditor` parity, default 200); a seed value already longer is NOT truncated (no silent data loss) but warns once. Set explicitly to `0` for no limit.