Numeric cell type

By default, Handsontable treats all cell values as string type. This is because <textarea> returns a string as its value.

In many cases you will prefer cell values to be treated as number type. This allows to format numbers nicely and sort them correctly.

To trigger the Numeric cell type, use the option type: 'numeric' in columns array or cells function.

Numeric cell type uses Numbro.js as the formatting library. Head over to their website to learn about the formatting syntax.

To use number formatting style valid for your language (i18n), load language definition to Numbro.js. See "Languages" section in Numbro.js docs for more info.

Car
Year
Price ($)
Price (€)
Mercedes A 1602006$6,999.996.999,99 €
Citroen C4 Coupe2008$8,330.008.330,00 €
Audi A4 Avant2011$33,900.0033.900,00 €
Opel Astra2004$7,000.007.000,00 €
BMW 320i Coupe2011$30,500.0030.500,00 €
Car
Year
Price ($)
Price (€)

var container = document.getElementById('example1'),
  hot;

hot = new Handsontable(container, {
  data: getCarData(),
  startRows: 7,
  startCols: 4,
  colHeaders: ['Car', 'Year', 'Price ($)', 'Price (€)'],
  columnSorting: true,
  columns: [
    {
      data: 'car'
      // 1nd column is simple text, no special options here
    },
    {
      data: 'year',
      type: 'numeric'
    },
    {
      data: 'price_usd',
      type: 'numeric',
      format: '$0,0.00',
      language: 'en-US' // this is the default locale, set up for USD
    },
    {
      data: 'price_eur',
      type: 'numeric',
      format: '0,0.00 $',
      language: 'de-DE' // i18n: use this for EUR (German)
      // more locales available on numeraljs.com
    }
  ]
});