Products

Jspreadsheet v4: The JavaScript Spreadsheet

Jexcel has been renamed to Jspreadsheet.

Jspreadsheet CE is a lightweight JavaScript spreadsheet component designed to create interactive web-based data grids with spreadsheet-like controls fully compatible with software such as Excel and Google Sheets. You can easily create and embed a spreadsheet in your application using a JavaScript array, JSON, CSV, or XLSX files. It supports copying data from Excel and pasting it directly into your online spreadsheet and vice versa. Integration with third-party JavaScript plugins is straightforward, allowing the creation of custom columns, editors, and additional features. With a wide range of native column types, Jspreadsheet is a comprehensive solution for web data management.

Create versatile online spreadsheets with Jspreadsheet and integrate them into your application in just a few steps. Impress your clients with an enhanced user experience powered by this robust data interaction tool.

  • Build rich, user-friendly data grid interfaces and applications.
  • Handle complex data inputs intuitively.
  • Enhance your data grid user experience with interactions familiar with spreadsheet software.
  • Develop rich CRUD applications with a beautiful UI.
  • Excel compatibility: copy and paste data using standard shortcuts.
  • Easily customizable with third-party plugin integrations.
  • Lightweight, fast, and easy to use.
  • Proven success across thousands of use cases.
  • Streamline data entry tasks in web-based applications.
  • Share and collaborate on stunning online spreadsheets.

Installation

From the NPM

npm install jspreadsheet-ce

From a CDN

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jspreadsheet-ce@4/dist/jspreadsheet.min.css" type="text/css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jspreadsheet-ce@4/dist/index.min.js"></script>

Clone our project

http://github.com/jspreadsheet/ce

Create amazing online spreadsheets

A example how to embed a simple javascript spreadsheet in your application. You can check out for more examples here.

<html>
<script src="https://bossanova.uk/jspreadsheet/v4/jspreadsheet.js"></script>
<link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jspreadsheet.css" type="text/css" />
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />

<div id="spreadsheet"></div>

<script>
var data = [
    ['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],
    ['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],
];

jspreadsheet(document.getElementById('spreadsheet'), {
    data: data,
    columns: [
        {
            type: 'text',
            title:'Car',
            width:90
        },
        {
            type: 'dropdown',
            title:'Make',
            width:120,
            source:[
                "Alfa Romeo",
                "Audi",
                "Bmw",
                "Chevrolet",
                "Chrystler",
                // (...)
              ]
        },
        {
            type: 'calendar',
            title:'Available',
            width:120
        },
        {
            type: 'image',
            title:'Photo',
            width:120
        },
        {
            type: 'checkbox',
            title:'Stock',
            width:80
        },
        {
            type: 'numeric',
            title:'Price',
            mask:'$ #.##,00',
            width:80,
            decimal:','
        },
        {
            type: 'color',
            width:80,
            render:'square',
        },
     ]
});
</script>
</html>

Jspreadsheet History

Jspreadsheet 4.6.0

  • Jexcel is renamed to Jspreadsheet.
  • Integration with Jsuites v4.

Jspreadsheet 4.2.3

  • The spreadsheet plugin is now compatible with Jsuites v3.
  • New flags and security implementations.
  • New DOM element references are in the toolbar, and worksheet events are tabbed.

Jspreadsheet 4.0.0

Special thanks to FDL - Fonds de Dotation du Libre for their support and sponsorship, which made the new version possible with many exciting features.

  • Workbook/tab support for spreadsheets.
  • Create dynamic spreadsheets from static HTML elements.
  • Highlight selected cells in the spreadsheet after CTRL+C.
  • Footer with formula support.
  • Multiple column resizing.
  • JSON update support (helpers to update a remote server).
  • Centralized event dispatch method for all spreadsheet events.
  • Custom helpers: =PROGRESS (progress bar), =RATING (5-star rating).
  • Custom formula helpers: =COLUMN, =ROW, =CELL, =TABLE, =VALUE.
  • Dynamic nested header updates.
  • New HTML editing column type.
  • New flags: includeHeadersOnCopy, persistence, filters, autoCasting, freezeColumns.
  • New events: onevent, onchangepage, onbeforesave, onsave.
  • More examples and documentation.

Jspreadsheet 3.9.0

  • New methods.
  • General fixes.

Jspreadsheet 3.6.0

  • Improved spreadsheet formula parsing.
  • New spreadsheet events.
  • New initialization options.
  • General fixes.

Jspreadsheet 3.2.3

  • getMeta, setMeta methods.
  • NPM package with jSuites.
  • General fixes.

Jspreadsheet 3.0.1

Jspreadsheet v3 is a complete rebuild of the JavaScript spreadsheet (previously a jQuery plugin). Due to the changes, full compatibility could not be ensured. If upgrading, your code may require some updates. For more information, refer to the article on upgrading from Jspreadsheet v2 or Handsontable.

New features in Jspreadsheet v3:

  • Drag and drop columns.
  • Resizable rows.
  • Merge columns.
  • Search functionality.
  • Pagination.
  • Lazy loading.
  • Full-screen mode.
  • Image upload.
  • Native color picker.
  • Better mobile compatibility.
  • Enhanced nested headers support.
  • Advanced keyboard navigation.
  • Better hidden column management.
  • Data picker enhancements: dropdown, autocomplete, multiple selection, group options, and icons.
  • Import from XLSX (experimental).

Major improvements:

  • A new formula engine with faster results and no external dependencies.
  • No use of selectors, leading to faster performance.
  • New native column types.
  • No jQuery required.
  • Examples for React, Vue, and Angular.
  • XLSX support via a custom SheetJS integration (experimental).

Jspreadsheet 2.1.0

  • Mobile touch improvements.
  • Paste fixes and a new CSV parser.

Jspreadsheet 2.0.0

  • New radio column type.
  • There is a new dropdown with autocomplete and multiple selection options.
  • Header/body separation for better scroll and column resize behaviour.
  • Text-wrap improvements, including Excel-compatible alt+enter.
  • New set/get meta information.
  • New set/get configuration parameters.
  • Programmatic set/get cell styles.
  • set/get cell comments.
  • Custom toolbar for tables.
  • Responsive calendar picker.

Jspreadsheet 1.5.7

  • Improvements to checkbox column type.
  • Updates to table destruction in jQuery.

Jspreadsheet 1.5.1

  • Spreadsheet data overflow and fixed headers. See an example.
  • Navigation improvements.

Jspreadsheet 1.5.0

  • Relative insertRow, deleteRow, insertColumn, deleteColumn. See an example.
  • Redo and undo support for insertRow, deleteRow, insertColumn, deleteColumn, moveRow.
  • New formula column recursive chain.
  • There is a new alternative design option (Bootstrap-like). See an example.
  • updateSettings improvements.

Copyright and License

Jspreadsheet CE is released under the MIT license.

About Jspreadsheet

Jspreadsheet is an original JavaScript software that facilitates data manipulation in web-based applications. It was inspired by other spreadsheet software and designed to be a lightweight, easy-to-use data input tool for users.

This free software was developed as a lightweight alternative to create amazing online JavaScript spreadsheets.