ce
Jspreadsheet is a lightweight JavaScript data grid component for creating interactive data grids with advanced spreadsheet controls.
A JavaScript library that embeds a full spreadsheet, like Excel or Google Sheets, directly into any web page. Includes editable cells, formulas, dropdowns, calendars, multiple worksheets, and copy-paste from Excel.
Jspreadsheet CE is a JavaScript library for embedding a spreadsheet-style data grid directly inside a web page. Instead of building tables with plain HTML or a basic grid library, you get an interface that looks and behaves like a desktop spreadsheet, with editable cells, column resizing, keyboard shortcuts, and copy-paste support that works with clipboard data from Excel.
You initialize it by pointing it at a div element on your page and passing in your data and column configuration. Each column can be assigned a type: text, numeric, dropdown, calendar, checkbox, image, or color picker. The library handles rendering, validation, and user input for each type. Formulas work across cells, and the library includes its own formula engine with no external dependencies.
Multiple worksheets can exist in a single grid, similar to tabs in a spreadsheet application. Features like search, pagination, column merging, row resizing, drag-and-drop column reordering, and frozen columns are all included. The library also provides events and methods so your application code can respond to changes and push or pull data programmatically.
It is available through npm or via CDN script tags, and dedicated wrappers are provided for React and Vue. The library was originally called jExcel before being renamed to Jspreadsheet. The community edition is open source, while a paid Pro version with additional features is sold separately.
The README includes a working code example showing a table with different column types, and links to a variety of examples in the documentation covering topics like rich text editing, XLSX import, web components, and jQuery integration.
Where it fits
- Replace a plain HTML table in your web app with an interactive spreadsheet where users can edit data, sort columns, and use formulas.
- Build a data entry form with dropdowns, date pickers, and checkboxes inside a grid without a separate UI library.
- Import Excel data into a web page and let users edit it in a familiar spreadsheet interface, then read the updated data back in JavaScript.