Popularity
9.6
Stable
Activity
9.7
Growing
17,610
454
2,864

Description

Handsontable is a JavaScript component that combines data grid features with spreadsheet-like UX. It provides data binding, data validation, filtering, sorting, and CRUD operations.

The most popular features of Handsontable:

  ✓  Multiple column sorting   ✓  Non-contiguous selection   ✓  Filtering data   ✓  Export to file   ✓  Validating data   ✓  Conditional formatting   ✓  Merging cells   ✓  Freezing rows/columns   ✓  Moving rows/columns   ✓  Resizing rows/columns   ✓  Hiding rows/columns   ✓  Context menu   ✓  Comments

Code Quality Rank: L2
Monthly Downloads: 0
Programming language: JavaScript
License: GNU General Public License v3.0 or later
Latest version: v12.1.3

Handsontable alternatives and similar libraries

Based on the "Dev Tools" category.
Alternatively, view HANDSONTABLE alternatives based on common mentions on social networks and blogs.

Do you think we are missing an alternative of Handsontable or a related project?

Add another 'Dev Tools' Library
Access the most powerful time series database as a service
sponsored www.influxdata.com

Popular Comparisons

Write Clean JavaScript Code. Always.
sponsored www.sonarsource.com

README

Handsontable is a JavaScript component that combines data grid features with spreadsheet-like UX. It provides data binding, data validation, filtering, sorting, and CRUD operations.

npm npm CI status FOSSA Status Quality Gate Status

Get Started with Handsontable

React  Angular  Vue  Vue 3    JavaScript 

Features

The most popular features of Handsontable:

  ✓  Multiple column sorting   ✓  Non-contiguous selection   ✓  Filtering data   ✓  Export to file   ✓  Validating data   ✓  Conditional formatting   ✓  Merging cells   ✓  Freezing rows/columns   ✓  Moving rows/columns   ✓  Resizing rows/columns   ✓  Hiding rows/columns   ✓  Context menu   ✓  Comments

Documentation

Get Started

Install with npm

Run the following command in your terminal

npm install handsontable

You can also use Yarn, NuGet or load the bundle directly from jsDelivr.

Create a placeholder

Create an HTML placeholder

<div id="example"></div>

Import Handsontable and its stylesheet

import Handsontable from "handsontable";
import 'handsontable/dist/handsontable.full.css';

Initialize the grid

Now turn your placeholder into a data grid with sample data.

const data = [
  ['', 'Tesla', 'Volvo', 'Toyota', 'Ford'],
  ['2019', 10, 11, 12, 13],
  ['2020', 20, 11, 14, 13],
  ['2021', 30, 15, 12, 13]
];

const container = document.getElementById('example');
const hot = new Handsontable(container, {
  data: data,
  rowHeaders: true,
  colHeaders: true
});

Support

We provide support for developers working with commercial version via contact form or at [email protected].

If you use a non-commercial version then please ask your tagged question on StackOverflow.

License

Handsontable is a commercial software with two licenses available:

  • Free for non-commercial purposes such as teaching, academic research, and evaluation. Read it here.
  • Commercial license with support and maintenance included. See pricing plans.

License key

If you use Handsontable in a project that supports your commercial activity, then you must purchase the license key at handsontable.com.

If you use the free for non-commercial license of Handsontable, then pass the phrase 'non-commercial-and-evaluation', as described in this documentation.

Proudly created and maintained by the Handsontable Team.


*Note that all licence references and agreements mentioned in the Handsontable README section above are relevant to that project's source code only.