diff --git a/docs/api/api_overview.md b/docs/api/api_overview.md index 2c807584..319e418a 100644 --- a/docs/api/api_overview.md +++ b/docs/api/api_overview.md @@ -70,6 +70,7 @@ Parameters: | [](api/spreadsheet_afterclear_event.md) | @getshort(api/spreadsheet_afterclear_event.md) | | [](api/spreadsheet_aftercolumnadd_event.md) | @getshort(api/spreadsheet_aftercolumnadd_event.md) | | [](api/spreadsheet_aftercolumndelete_event.md) | @getshort(api/spreadsheet_aftercolumndelete_event.md) | +| [](api/spreadsheet_afterdataloaded_event.md) | @getshort(api/spreadsheet_afterdataloaded_event.md) | | [](api/spreadsheet_aftereditend_event.md) | @getshort(api/spreadsheet_aftereditend_event.md) | | [](api/spreadsheet_aftereditstart_event.md) | @getshort(api/spreadsheet_aftereditstart_event.md) | | [](api/spreadsheet_afterfocusset_event.md) | @getshort(api/spreadsheet_afterfocusset_event.md) | diff --git a/docs/api/overview/events_overview.md b/docs/api/overview/events_overview.md index aab095f1..11a4ea39 100644 --- a/docs/api/overview/events_overview.md +++ b/docs/api/overview/events_overview.md @@ -12,6 +12,7 @@ description: You can have an Events overview of the DHTMLX JavaScript Spreadshee | [](../spreadsheet_afterclear_event.md) | @getshort(../spreadsheet_afterclear_event.md) | | [](../spreadsheet_aftercolumnadd_event.md) | @getshort(../spreadsheet_aftercolumnadd_event.md) | | [](../spreadsheet_aftercolumndelete_event.md) | @getshort(../spreadsheet_aftercolumndelete_event.md) | +| [](../spreadsheet_afterdataloaded_event.md) | @getshort(../spreadsheet_afterdataloaded_event.md) | | [](../spreadsheet_aftereditend_event.md) | @getshort(../spreadsheet_aftereditend_event.md) | | [](../spreadsheet_aftereditstart_event.md) | @getshort(../spreadsheet_aftereditstart_event.md) | | [](../spreadsheet_afterfocusset_event.md) | @getshort(../spreadsheet_afterfocusset_event.md) | diff --git a/docs/api/spreadsheet_afterdataloaded_event.md b/docs/api/spreadsheet_afterdataloaded_event.md new file mode 100644 index 00000000..4d1dcd90 --- /dev/null +++ b/docs/api/spreadsheet_afterdataloaded_event.md @@ -0,0 +1,40 @@ +--- +sidebar_label: afterDataLoaded +title: afterDataLoaded event +description: You can learn about the afterDataLoaded event in the documentation of the DHTMLX JavaScript Spreadsheet library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet. +--- + +# afterDataLoaded + +### Description + +@short: Fires after data loading is complete + +### Usage + +~~~jsx +afterColumnAdd: (cell: string) => void; +~~~ + +### Example + +~~~jsx +const spreadsheet = new dhx.Spreadsheet("spreadsheet_container", {}); +spreadsheet.parse(data); + +// subscribe to the "afterDataLoaded" event +spreadsheet.events.on("afterDataLoaded", () => { + dhx.message({ + text: "Data is successfully loaded into Spreadsheet!", + css: "dhx_message--success", + expire: 5000 + }); +}); +~~~ + +**Change log:** Added in v5.2 + +**Related article:** [Event handling](handling_events.md) + +**Related sample:** [Spreadsheet. Data loaded event](https://snippet.dhtmlx.com/vxr7amz6) + diff --git a/docs/migration.md b/docs/migration.md index 3a682ebb..15a089c9 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -6,6 +6,83 @@ description: You can learn about migration in the documentation of the DHTMLX Ja # Migration to newer versions +## 5.1 -> 5.2 + +### toolbarBlocks + +In v5.2 the [toolbarBlocks](api/spreadsheet_toolbarblocks_config.md) property is modified in the following way: + +- the default set of toolbar options is extended by the new *"cell"* option. It includes the *Border* button and the *Merge* button (previously, it was in the *"align"* block) +- the *"actions"* toolbar block is extended with the *Insert link* button (previously, it was in the *"helpers"* block) +- the *"helpers"* toolbar block is renamed to *"help"* and isn't included in the default set of toolbar options + +~~~jsx title="Before v5.2" {9} +// default configuration +toolbarBlocks: [ + "undo", + "colors", + "decoration", + "align", + "format", + "actions", + "helpers" +] +~~~ + +~~~jsx title="From v5.2" {7} +// default configuration +toolbarBlocks: [ + "undo", + "colors", + "decoration", + "align", + "cell", + "format", + "actions" +] +~~~ + +### Freezing/unfreezing functionality + +In v5.2 the way of freezing/unfreezing columns and rows has been modified: + +- the `leftSplit` and `topSplit` configuration properties that have been used for fixing columns and rows were deprecated +- new API methods `freezeCols()`, `unfreezeCols()`, `freezeRows()`, `unfreezeRows()` and a new action `toggleFreeze` were introduced + +~~~jsx title="Before v5.0" +const spreadsheet = new dhx.Spreadsheet("spreadsheet_container", { + topSplit: 1, // the number of row to "freeze" + leftSplit: 1 // the number of columns to "freeze" +}); +~~~ + +~~~jsx title="From v5.0" +// for rows +spreadsheet.freezeRows("B2"); // the rows up to the second row will be fixed +spreadsheet.freezeRows("sheet2!B2"); // the rows up to the second row in "sheet2" will be fixed +spreadsheet.unfreezeRows(); // fixed rows in the current sheet will be unfrozen +spreadsheet.unfreezeRows("sheet2!A1"); // fixed rows in "sheet2" will be unfrozen + +// for columns +spreadsheet.freezeCols("B2"); // the columns up to the "B" column will be fixed +spreadsheet.freezeCols("sheet2!B2"); // the columns up to the "B" column in "sheet2" will be fixed +spreadsheet.unfreezeCols(); // fixed columns in the current sheet will be unfrozen +spreadsheet.unfreezeCols("sheet2!A1"); // fixed columns in "sheet2" will be unfrozen + +// using the `toggleFreeze` action with the beforeAction/afterAction events +spreadsheet.events.on("afterAction", (actionName, config) => { + if (actionName === "toggleFreeze") { + console.log(actionName, config); + } +}); + +spreadsheet.events.on("beforeAction", (actionName, config) => { + if (actionName === "toggleFreeze") { + console.log(actionName, config); + } +}); +~~~ + ## 4.3 -> 5.0 In v5.0, the *"help"* option of the [toolbarBlocks](api/spreadsheet_toolbarblocks_config.md) property is renamed to *"helpers"*. Besides, the default set of options is extended by the new *"actions"* option. diff --git a/docs/whats_new.md b/docs/whats_new.md index f22152bf..b86977e3 100644 --- a/docs/whats_new.md +++ b/docs/whats_new.md @@ -8,6 +8,56 @@ description: You can learn what's new in the DHTMLX JavaScript Spreadsheet libra If you are updating Spreadsheet from an older version, check [Migration to Newer Version](migration.md) for details. +## Version 5.2 + +Released on May X, 2025 + +[Review of release on the blog](https://dhtmlx.com/blog/dhtmlx-spreadsheet-5-2/) + +### Breaking changes + +The new release introduces some changes to the `toolbarBlocks` property and the freezing/unfreezing functionality for columns and rows. Check the [Migration guide](migration.md/#51---52) to keep in step with the latest version. + +### Deprecated + +- The `leftSplit` and `topSplit` configuration properties are removed + +### New functionality + +- Editing cells: + - the ability to create a styled border for a group of cells via UI +- Freezing/unfreezing columns/rows: + - the ability to freeze/unfreeze columns and rows via UI + - the ability to freeze/unfreeze columns and rows via API + - new methods: `freezeCols()`, `unfreezeCols()`, `freezeRows()`, `unfreezeRows()` + - new action: `toggleFreeze` + - new `freeze` property for the *sheets* object of the `parse()` method +- Hiding/showing columns/rows: + - the ability to hide/show columns and rows via UI + - the ability to hide/show columns and rows via API + - new methods: `hideCols()`, `showCols()`, `hideRows()`, `showRows()` + - new action: `toggleVisibility` + - new `hidden` property for the *cols* and *rows* configs of the *sheets* object of the `parse()` method +- Working with formulas: + - a popup with descriptions for formulas is added + - a new locale: `formulas` is added +- File import: + - a new [`afterDataLoaded`](api/spreadsheet_afterdataloaded_event.md) event is added + +### Fixes + +- The issue with sorting +- The issue with the filter shifting to a new column +- The error that occurred on blocking a sheet adding with the "addSheet" action +- The issue with filtering blank cells +- The problem with editing a large spanned table +- The error that occurred on undoing an action in a cell +- The error that occurred on entering/editing a cell with the IF formula +- Th script error that occurred after cutting and pasting a link +- The issue with changing the text alignment during export/import of an .xlsx file +- The issue with Spreadsheet losing focus after some actions +- Performance improvements + ## Version 5.1.8 Released on December 10, 2024 diff --git a/sidebars.js b/sidebars.js index 90097b89..d6215f67 100644 --- a/sidebars.js +++ b/sidebars.js @@ -102,6 +102,7 @@ module.exports = { "api/spreadsheet_afterclear_event", "api/spreadsheet_aftercolumnadd_event", "api/spreadsheet_aftercolumndelete_event", + "api/spreadsheet_afterdataloaded_event", "api/spreadsheet_aftereditend_event", "api/spreadsheet_aftereditstart_event", "api/spreadsheet_afterfocusset_event",