Fork me on GitHub

# Handsontable

a minimalistic Excel-like data grid editor for HTML, JavaScript & jQuery

## 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`.

## 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.TextRenderer,
              editor: Handsontable.TextEditor
              }
              ]

This mapping is defined in file src/cellTypes.js

For more examples, head back to the main page.

Handsontable © 2012 Marcin Warpechowski and contributors.
Code and documentation licensed under the The MIT License.