Documentation keyboard_arrow_right Upgrades
What's New in Version 12
Overview
Version 12 delivers unprecedented performance improvements, efficiently handling over 1 million rows with real DOM elements while maintaining exceptional speed and flexibility.
This release introduces powerful new features including advanced formula capabilities, improved copy-paste operations with style preservation, worksheet tables, and enhanced mobile navigation. These advancements strengthen our commitment to providing the most comprehensive JavaScript spreadsheet solution available.
Highlights
- Extended Viewport: Support for 1M+ rows with optimized rendering.
- Performance: Range and calculation optimizations for better performance
- Mobile Navigation: Significant improvements in mobile navigation and better responsiveness
- Touch Support: Enhanced touch interactions and responsiveness
- Accessibility: Improved keyboard navigation with IME capabilities
New features
- Worksheet Tables: New table feature for structured data management
- Enhanced Copy-Paste: Copy and paste from Excel/Google Sheets with style preservation
- Web Components: Support for web-components-based editors
- Multi-Selection: Drag and drop support for multiple columns and rows
- Force as text: Special text string character to force any input to be treated as text
- Context Menu: New keyboard navigation support
- Top Menu: New native top menu implementation
- Selections: Deselect with CTRL+click consistent with other spreadsheet software
Behavior and Critical Updates
- Column Width: Changing the width of hidden columns/rows does not change the visibility state
- Null Handling:
undefined/null is treated differently from empty strings for calculations and getData()
- Empty String Definition: To explicitly define empty strings, use
"''"
New Extensions
- @jspreadsheet/extensions: Collection of all extensions
- @jspreadsheet/format: Extension for custom editors and cell masking
Upgrade Requirements
Version 12 maintains the best compatibility possible with version 11 but includes important changes detailed below. Review these modifications carefully before upgrading to assess their impact on your existing codebase.
Potential Breaking Changes
Data Configuration
| Status |
Property |
Description |
| New |
autoNames |
Ensures all properties from the first data element are declared as existing columns and defines column names when not explicitly declared |
| Removed |
ignoreUndefinedColumns |
Replaced by autoNames |
| Updated |
updateCell |
Returns object or boolean |
Persistence
Jspreadsheet has removed these controls in favor of persistence: function which brings much more flexibility to developers. Additionally, the new autoId property helps to track row ids using guids.
Worksheet Level
| Status |
Property |
Description |
| Removed |
persistence |
Use persistence at the spreadsheet level |
| Removed |
server |
Use persistence at the spreadsheet level |
| Removed |
save |
Method has been removed |
| Removed |
sequence |
Sequence controls removed |
| Removed |
getNextSequence |
Sequence controls removed |
Spreadsheet Level
| Status |
Property |
Description |
| Removed |
onbeforesave |
Use persistence at the spreadsheet level |
| Removed |
onsave |
Use persistence at the spreadsheet level |
| Removed |
onbeforesend |
Use persistence at the spreadsheet level |
Columns
This new version brings some new features, such as:
- Column Visibility: Now includes arrow indicators;
- Multi Column Drag: Drag and drop multiple columns simultaneously;
Worksheet Level
| Status |
Property |
Description |
| Removed |
getPrimaryKey |
Method has been dropped |
Column settings
| Status |
Property |
Description |
| Removed |
type: autoNumber |
Editor has been removed |
| Removed |
primaryKey: boolean |
Property is no longer valid |
Rows
This new version brings some new changes and new features:
- Row Visibility: Now includes arrow indicators;
- Multiple Row Drag: Drag and drop multiple rows simultaneously;
- Automatic Ids: Automatically allocate guids for new rows;
| Status |
Method/Property |
Description |
| Updated |
getId |
Signature changed - second argument dropped |
| New |
autoId |
Allocate a guid automatically for new added rows |
Formulas and Calculations
Huge performance optimizations have been introduced on version 12, with much better range management, a new type of chain for column and lines and calculations by reference when used together with Formula Pro Version 6.
- Worksheet Names: Can now accept special characters when used as
'Countries-EU'
- Internal Arrays: Array controllers have been updated
- Formula Pro: New syntax to accept
=100 * .1
- onerror: The
formula pro includes the event onerror to be triggered when a formula generates errors.
Worksheet Level
| Status |
Property |
Description |
| Removed |
preCalculation |
With optimized calculations all formulas are calculated on loading to improve navigation performance |
| Removed |
secureFormula |
Property has been dropped |
| Deprecated |
updateFormula |
Method is deprecated |
| Updated |
executeFormula |
Signature has changed |
| Removed |
columnNamesInFormulas |
Use definedNames for better compatibility |
| New |
setChain |
New chain system with setChain function for custom chain objects |
Spreadsheet Level
| Status |
Property/Method |
Description |
| Updated |
onbeforeformula |
Signature has changed |
| Updated |
onchangereferences |
Signature changed to provide expanded table structure information |
Removed Functions
Custom formulas can be used to restore these functions if needed.
| Status |
Method |
| Removed |
=CHART |
| Removed |
=TABLE |
| Removed |
=VAL |
| Removed |
=NULL |
Clipboard
Jspreadsheet automatically includes styles when copying data from Excel, Google Sheets or other external spreadsheets or tables, as long as the content is smaller than 10MB.
- External Paste: Pasting from external software now brings style information.
- Paste Special: New paste special controls are available in the context menu.
Paste with style
/** Paste with style max size. Default: 10MB */
jspreadsheet.pasteWithStyleMaxSize = 10000000;
Properties Management
| Status |
Property |
Description |
| Removed |
getProperties |
Use getProperty instead |
| Removed |
setProperties |
Use setProperty instead |
| Removed |
updateProperty |
Use setProperty instead with argument for update. |
| Deprecated |
getOptions |
Use getProperty instead |
| Updated |
setProperty |
New argument to add properties on top of the existing ones. |
Validations
Several improvements to validations have been brought with version 12, such as:
- Custom Validations: New setter
jspreadsheet.setValidationHandler(name, handler)
- Dynamic Lists: Support for
type=formula and type=list with dropdown and formulas for dynamic lists
| Status |
Property |
Description |
| Updated |
hasErrors |
Return value changed from boolean to boolean | [] to identify error locations |
| Updated |
loadValidations |
Last argument bringIndex has been dropped |
Filters
Several improvements that include performance and filters have been included, and some other changes, such as:
- Column-Specific Filters: It is no longer possible to activate filters for specific column headers; you can activate at the header level or range level
- Range Filters: Better range filtering capabilities
- History Integration: Toggle filters are included in history to accept undo/redo operations
| Status |
Method |
Description |
| Updated |
getFilters |
Signature has changed |
| Updated |
setFilters |
Signature has changed |
| Updated |
openFilter |
Signature has changed |
| Updated |
resetFilters |
Signature changed. Use hideFilters to remove filters |
| Updated |
hideFilters |
Signature changed - will destroy the whole filter |
Editors
The new version brings significant improvements to editors. More accessibility with ARIA, enhanced IME and keyboard and navigation support. Additionally, custom editors can be created as web-components and other features as described below.
| Status |
Property |
Description |
| New |
strictMode: boolean |
For dropdowns to block non-listed values |
| Removed |
filter |
Property has been dropped |
Editor Types
There are significant editor updates, including a complete new widget for calendar and dropdowns. Please check the editors section for more information.
| Status |
Editor/Property |
Description |
| Removed |
autonumber |
Editor has been removed |
| Removed |
percent |
Alternatively use format or mask |
| Updated |
dropdown | autocomplete |
Enhanced IME keyboard and navigation support |
| Updated |
calendar |
Keyboard navigation and range support |
Viewport
The highlight of the viewport updates is the improved capability to handle millions of rows. Additionally, several properties have been moved to the spreadsheet level to ensure consistency across different worksheets.
Worksheet Level
| Status |
Property |
Description |
| Updated |
tableOverflow |
Now defined at the spreadsheet level |
| Updated |
tableWidth |
Now defined at the spreadsheet level |
| Updated |
tableHeight |
Now defined at the spreadsheet level |
| Updated |
resize |
Removed. Use resizable at the spreadsheet level |
Spreadsheet Level
| Status |
Property |
Description |
| New |
tableOverflow: boolean |
Worksheet dimensions for all worksheets |
| New |
tableWidth: number |
Worksheet dimensions |
| New |
tableHeight: number |
Worksheet dimensions |
| New |
resizable: boolean |
Worksheet is resizable |
Shortcuts
The new shortcut management system is more flexible and logical, using an object-based declaration to match keyboard events.
More information
Group Columns/Rows
There are three main updates to row and column grouping:
- Background color has been removed.
- History support has been added, allowing users to undo open/close group actions.
- Improved consistency in group behavior across the spreadsheet.
Search
| Status |
Property/Method |
Description |
| Removed |
updateSearch |
Method no longer available |
Footers
Footers have better capabilities, more flexible methods and are updated automatically during formula updates.
| Status |
Method/Property |
Description |
| Deprecated |
refreshFooter |
Method is deprecated |
| Updated |
setFooterValue |
Now receives an array of values |
| Updated |
onrenderfootercell |
Signature changed for event |
History
- Cascade Events: The history event onredo or
onundo happens only once even when there are cascade events.
- Performance: Improved history management and performance.
