JavaScript Excel tables library

Here we present a great solution for JavaScript Excel tables. We can do it well and easy!

Handsontable – the JavaScript Excel tables library

Handsontable is a data grid component with an Excel-like appearance. Built in JavaScript, it integrates with any data source with peak efficiency. It comes with powerful features like data validation, sorting, grouping, data binding, formula support or column ordering.

Distributed free under the MIT license.

Excel tables in JavaScript and CSS
Excel tables in JavaScript and CSS

Perks

– HIGH PERFORMANCE – the virtual rendering handles up to one million rows or columns

– FREE AND OPEN – Free for either private or commercial projects

– EXCEL-LIKE APPEARANCE – No need to learn the interface from scratch

– EASY INTEGRATION with your project!

Basic usage:

...
<script src="//handsontable.com/dist/handsontable.full.js"></script>
<link rel="stylesheet" media="screen" href="//handsontable.com/dist/handsontable.full.css">
...

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

Now let’s define some small input data and run JS code:

var data = [
  ["", "Ford", "Volvo", "Toyota", "Honda"],
  ["2014", 10, 11, 12, 13],
  ["2015", 20, 11, 14, 13],
  ["2016", 30, 15, 12, 13]
];

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

Examples:

http://handsontable.com/examples.html

Docs:

http://docs.handsontable.com/0.20.2/tutorial-quick-start.html

GitHub:

https://github.com/handsontable/handsontable

Enjoy!

Share:Share on Facebook1Share on Google+0Tweet about this on TwitterShare on LinkedIn1Pin on Pinterest1