Editor Checkbox

editorCheckbox

The editorCheckbox is a custom cell editor for RevoGrid that provides a checkbox input to edit boolean values directly within the grid cells.

Features:

• Renders a checkbox input element for cells, allowing users to toggle boolean values (true/false) with a simple click.
• Automatically dispatches a celledit event upon change, updating the grid’s data model with the new value.
• Ensures seamless integration with RevoGrid by providing row and column details in the event payload.

Usage:

• Import editorCheckbox and assign it to the cellTemplate property of a column in the RevoGrid.
• Ideal for columns that require quick boolean editing, such as toggling statuses or enabling/disabling options.

Example

import { editorCheckbox } from '@revolist/revogrid-pro'

const grid = document.createElement('revo-grid');
grid.columns = [
  {
    prop: 'enabled',
    name: 'Enabled',
    cellTemplate: editorCheckbox,
  },
];

Event Handling:

• The editorCheckbox dispatches a celledit event whenever the checkbox value changes.
• The event detail contains:
  • rgCol: The column index of the edited cell.
  • rgRow: The row index of the edited cell.
  • type: The type of the cell.
  • prop: The property of the cell being edited.
  • val: The new value (true/false) after the checkbox toggle.
  • preventFocus: A flag to control grid focus behavior (default: false).

This editor is particularly useful in scenarios where users need to enable or disable specific options directly from the grid, providing a quick and user-friendly interface for boolean data editing.

editorCheckbox: CellTemplate | undefined;