DOCSEARCHbyAlgolia
Submit Docs

Handsontable JavaScript Data Grid

website·Indexed 37 days ago

https://handsontable.com/docs/javascript-data-grid/

A JavaScript data grid component that allows developers to create interactive spreadsheets. It provides wrappers for Angular, React, and Vue, and includes comprehensive configuration options for grids, columns, rows, and individual cells.

Tokens
350.4K
Snippets
1.8K
Records
2.7K
Agent score
73%

What's inside Handsontable

  1. Overview of Named Expressions in HyperFormula

    Named expressions allow you to assign human-friendly names to formulas, strings, numbers, or cell ranges. These names can be referenced anywhere across the workbook, simplifying formulas and improving maintainability.

    Key constraints:

    • References within named expressions are always absolute. Relative references are not supported.
    • Dynamic ranges can be achieved using functions like INDEX and OFFSET.
    • Named ranges can overlap (e.g., one name covering A1:D10 and another covering A1:E1).

  2. Overview of HyperFormula

    HyperFormula is an open-source headless spreadsheet library built in TypeScript. It acts as a parser and evaluator for spreadsheet formulas and can be integrated into browser-based applications or used as a service in Node.js. It does not provide a user interface, making it suitable for calculated fields in CRM/ERP software, business logic builders, online calculators, and as a deterministic compute layer for AI/LLMs.

  3. Overview of HyperFormula calculation engine

    HyperFormula is a headless TypeScript library used to evaluate Excel-compatible formulas deterministically. Because it is headless (no UI included), it can be integrated into any browser, Node.js environment, or UI framework. It is designed for high-performance, repeatable results and handles table-shaped datasets, cross-cell dependencies, and complex calculation flows.

  4. Overview of the Handsontable Design System

    The Handsontable Design System is a toolkit used for building, prototyping, and customizing data grids. It provides grid components and design tokens that allow developers to integrate Handsontable into an application's layout or apply advanced customizations using features such as auto layout and variables.

  5. Overview of Column Summary plugin

    The ColumnSummary plugin allows you to calculate and display aggregates (such as sum, min, max, count, and average) for a range of rows within a specific column. Handsontable aggregates are column-based; there is no built-in row summary feature. To achieve per-row totals across columns, you must compute them in the data source or use a custom renderer.

  6. Overview of HyperFormula built-in functions

    HyperFormula provides a library of 423 pre-built functions that follow standard spreadsheet software syntax and logic. These functions are grouped into several categories including Array manipulation, Database, Date and time, Engineering, Financial, Information, Logical, Lookup and reference, Math and trigonometry, Matrix functions, Operator, Statistical, and Text. Built-in function names are available in 17 languages, and users can add custom language packs for further localization.

  7. Overview of Handsontable JavaScript Data Grid

    Handsontable is an extensible JavaScript data grid component used to build tabular, data-oriented user interfaces. It renders an interactive spreadsheet-like grid directly in the browser and is suitable for software such as inventory management systems, ERPs, data modeling applications, and reporting platforms.

  8. Overview of HyperFormula MCP Server

    The HyperFormula MCP Server is a Model Context Protocol (MCP) server that provides AI clients (such as Claude Desktop, Cursor, and VS Code) with deterministic spreadsheet and formula computation capabilities. It allows LLMs to evaluate Excel-compatible formulas, read/write cells and ranges, and trace dependencies using over 400 built-in functions (e.g., SUM, VLOOKUP, IRR, INDEX/MATCH) without relying on the LLM's own mathematical reasoning.

  9. Overview of declarative custom cell creation in Handsontable

    Handsontable provides a declarative, factory-based approach to creating custom cell types based on the 'convention-over-configuration' principle. This method allows developers to start with a minimal working cell definition and adjust it, offering a simpler and faster alternative to the traditional imperative, class-based approach for building editors and prototypes while still maintaining access to all Handsontable features.

  10. Overview of row hiding in Handsontable

    Row hiding allows you to prevent specific rows from being rendered as DOM elements to reduce screen clutter and improve performance. Unlike row trimming, hiding a row does not modify the source data, and the rows remain present in getData() while keeping their visual index. The HiddenRows plugin handles this functionality without transforming the data shape.

  11. Overview of LazilyTransformingAstService

    The LazilyTransformingAstService handles formula AST transformations lazily. When structural changes occur (e.g., renaming sheets, moving cells, or adding/removing rows/columns), the service stores these transformations in a queue instead of immediately updating every formula in the spreadsheet. Each FormulaVertex and ValueIndex tracks its own version number; when data is requested, the service applies only the transformations accumulated since that specific version.

  12. Understand the Handsontable cell type behavior

    The Handsontable cell type creates a cell that displays a text input with a trigger icon. When a user activates the cell, an embedded grid (a 'HOT-in-HOT' instance) opens. The user can navigate this embedded grid and select a row, and the value of the selected row is then written back to the parent cell.