Custom cell with CheckBox for editing and view

Environment

Product

Progress® KendoReact Grid

Description

How can I display a boolean value in CheckBox in view mode and editable CheckBox when the row is in edit mode.

Solution

Add custom cell for the boolean column and render disabled CheckBox for view mode of the cell and enabled CheckBox when the dataItem is in edit mode.

Here is an example demonstrating this approach:

Change Theme

Theme

Loading ...

The example is using an extended Grid cell (ExtendedGridCell) which adds all class names and attributes to the TD elements and allows changing only the content of the cell. This extended Grid cell is useful for every scenario with custom cells.