Handsontable

Cell types

This page is an introduction to Handsontable cell types:

• Preview of built-in and custom cell types
• Anatomy of a cell type

Preview of built-in and custom cell types

The below example shows all built-in cell types (in other words, combinations of cell renderers and editors) available in Handsontable:

• text
• numeric
• checkbox
• date
• autocomplete

The same example also shows the declaration of custom cell renderers, namely yellowRenderer and greenRenderer.

Dump data to console

Anatomy of a cell type

A cell type is a predefined set of cell properties. Cell type defines what renderer and editor should be used for a cell. They can also define any different cell property that will be assumed for each matching cell.

For example writing:

          columns: [{
            type: 'text'
          }]
        

Equals:

          columns: [{
            renderer: Handsontable.renderers.TextRenderer,
            editor: Handsontable.editors.TextEditor
          }]
        

This mapping is defined in file src/cellTypes.js