From 515e619131e8595fe22be498b0aae14a4e75cfe4 Mon Sep 17 00:00:00 2001 From: Masha_Rudenko Date: Mon, 24 Aug 2026 12:19:14 +0300 Subject: [PATCH 1/2] [add] what's new entry for v6.0.3 - four fixes: serialize() losing custom column and row sizes for empty cells, scroll "jumping" in Chrome, formulas lost on Excel import, locked cell state lost on Excel export and import - entry added to the English page and to the ru, de, ko, zh translations - locale anchors follow each page's own scheme: {#fixes-603} in all four translations, matching the {#version-603} heading anchor --- docs/whats_new.md | 11 +++++++++++ .../current/whats_new.md | 11 +++++++++++ .../current/whats_new.md | 11 +++++++++++ .../current/whats_new.md | 11 +++++++++++ .../current/whats_new.md | 11 +++++++++++ 5 files changed, 55 insertions(+) diff --git a/docs/whats_new.md b/docs/whats_new.md index db3c9f4b..9afbf47e 100644 --- a/docs/whats_new.md +++ b/docs/whats_new.md @@ -8,6 +8,17 @@ 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 6.0.3 + +Released on August 24, 2026 + +### Fixes + +- Custom column and row sizes were lost by the `serialize()` method if the cells were empty +- Scroll "jumping" in Chrome when a selected cell re-entered the viewport +- Some formulas disappeared after importing data from an Excel file +- The "locked" state of cells was lost during Excel export and import + ## Version 6.0.2 Released on July 1, 2026 diff --git a/i18n/de/docusaurus-plugin-content-docs/current/whats_new.md b/i18n/de/docusaurus-plugin-content-docs/current/whats_new.md index f5a3a2ce..543c1739 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/whats_new.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/whats_new.md @@ -8,6 +8,17 @@ description: Sie erfahren in der Dokumentation, was neu in der DHTMLX JavaScript Wenn Sie Spreadsheet von einer älteren Version aktualisieren, lesen Sie die [Migration auf eine neuere Version](migration.md) für Details. +## Version 6.0.3 {#version-603} + +Veröffentlicht am 24. August 2026 + +### Fehlerbehebungen {#fixes-603} + +- Benutzerdefinierte Spalten- und Zeilengrößen gingen bei der Methode `serialize()` verloren, wenn die Zellen leer waren +- "Springendes" Scrollen in Chrome, wenn eine ausgewählte Zelle wieder in den sichtbaren Bereich gelangte +- Einige Formeln verschwanden nach dem Importieren von Daten aus einer Excel-Datei +- Der Zustand "gesperrt" von Zellen ging beim Excel-Export und -Import verloren + ## Version 6.0.2 {#version-602} Veröffentlicht am 1. Juli 2026 diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/whats_new.md b/i18n/ko/docusaurus-plugin-content-docs/current/whats_new.md index 47fa236d..3febc7f0 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/whats_new.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/whats_new.md @@ -8,6 +8,17 @@ description: DHTMLX JavaScript Spreadsheet 라이브러리의 새로운 기능 이전 버전에서 Spreadsheet를 업그레이드하는 경우 [최신 버전으로 마이그레이션](migration.md)에서 자세한 내용을 확인하세요. +## 버전 6.0.3 {#version-603} + +2026년 8월 24일 출시 + +### 수정 사항 {#fixes-603} + +- 셀이 비어 있는 경우 `serialize()` 메서드에서 사용자 지정 열 및 행 크기가 사라지는 문제 +- 선택한 셀이 다시 표시 영역에 들어올 때 Chrome에서 스크롤이 "튀는" 문제 +- Excel 파일에서 데이터를 가져온 후 일부 수식이 사라지는 문제 +- Excel 내보내기 및 가져오기 과정에서 셀의 "잠금" 상태가 사라지는 문제 + ## 버전 6.0.2 {#version-602} 2026년 7월 1일 출시 diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/whats_new.md b/i18n/ru/docusaurus-plugin-content-docs/current/whats_new.md index cd3cb90b..959b1ac4 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/whats_new.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/whats_new.md @@ -8,6 +8,17 @@ description: В документации вы можете узнать, что Если вы обновляете Spreadsheet с более ранней версии, ознакомьтесь с [Миграцией на новую версию](migration.md). +## Версия 6.0.3 {#version-603} + +Выпущена 24 августа 2026 года + +### Исправления {#fixes-603} + +- Пользовательские размеры столбцов и строк терялись при вызове метода `serialize()`, если ячейки были пустыми +- «Прыжки» прокрутки в Chrome при возврате выделенной ячейки в область видимости +- Некоторые формулы исчезали после импорта данных из файла Excel +- Состояние «заблокировано» у ячеек терялось при экспорте и импорте Excel + ## Версия 6.0.2 {#version-602} Выпущена 1 июля 2026 года diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/whats_new.md b/i18n/zh/docusaurus-plugin-content-docs/current/whats_new.md index 050e660a..9cf644bc 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/whats_new.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/whats_new.md @@ -8,6 +8,17 @@ description: 您可以在文档中了解 DHTMLX JavaScript Spreadsheet 库的最 如果您正在从旧版本升级 Spreadsheet，请查阅[迁移到新版本](migration.md)了解详细信息。 +## 版本 6.0.3 {#version-603} + +发布于 2026 年 8 月 24 日 + +### 修复 {#fixes-603} + +- 单元格为空时 `serialize()` 方法丢失自定义列宽和行高的问题 +- 选中的单元格重新进入可视区域时 Chrome 中滚动"跳动"的问题 +- 从 Excel 文件导入数据后部分公式丢失的问题 +- Excel 导出和导入过程中单元格"锁定"状态丢失的问题 + ## 版本 6.0.2 {#version-602} 发布于 2026 年 7 月 1 日 From 55b1c52c5f9ad2a292d45779adf814bba3c64ee8 Mon Sep 17 00:00:00 2001 From: Masha_Rudenko Date: Mon, 24 Aug 2026 12:19:28 +0300 Subject: [PATCH 2/2] [update] serialize() reference and locked cells in export/import - serialize(): Usage now shows the full returned shape, Returns adds the previously undocumented id, merged and freeze sheet attributes, the real shape of cols/rows and of the cell objects in data, plus notes on the 6.0.3 behavior: cols/rows extend past the data range to keep custom sizes of empty columns and rows, and a cell with only a locked state stays in data. Round-trip contract with parse() stated - loading_data: "Saving and restoring state" no longer claims serialize() returns an array of cell objects; export and import sections list what an .xlsx file keeps and restores, including the locked state of cells - working_with_cells: new "Saving the locked state" section - export.xlsx(): note on what an exported file keeps - lock(): related article link to "Locking cells" - all changes translated into ru, de, ko, zh --- docs/api/export_xlsx_method.md | 2 + docs/api/spreadsheet_lock_method.md | 4 +- docs/api/spreadsheet_serialize_method.md | 81 ++++++++++++++++--- docs/loading_data.md | 8 +- docs/working_with_cells.md | 9 +++ .../current/api/export_xlsx_method.md | 2 + .../current/api/spreadsheet_lock_method.md | 2 + .../api/spreadsheet_serialize_method.md | 81 ++++++++++++++++--- .../current/loading_data.md | 8 +- .../current/working_with_cells.md | 9 +++ .../current/api/export_xlsx_method.md | 2 + .../current/api/spreadsheet_lock_method.md | 2 + .../api/spreadsheet_serialize_method.md | 81 ++++++++++++++++--- .../current/loading_data.md | 8 +- .../current/working_with_cells.md | 9 +++ .../current/api/export_xlsx_method.md | 2 + .../current/api/spreadsheet_lock_method.md | 2 + .../api/spreadsheet_serialize_method.md | 81 ++++++++++++++++--- .../current/loading_data.md | 8 +- .../current/working_with_cells.md | 9 +++ .../current/api/export_xlsx_method.md | 2 + .../current/api/spreadsheet_lock_method.md | 2 + .../api/spreadsheet_serialize_method.md | 81 ++++++++++++++++--- .../current/loading_data.md | 8 +- .../current/working_with_cells.md | 9 +++ 25 files changed, 456 insertions(+), 56 deletions(-) diff --git a/docs/api/export_xlsx_method.md b/docs/api/export_xlsx_method.md index b7ec5602..b6dfc849 100644 --- a/docs/api/export_xlsx_method.md +++ b/docs/api/export_xlsx_method.md @@ -39,6 +39,8 @@ spreadsheet.export.xlsx("MyData"); Note that the component supports export to Excel files with the `.xlsx` extension only. ::: +Besides cell values, an exported file keeps the cell styles, the number formats, the merged cells, the frozen columns and rows, the links, the drop-down editors, and the locked state of cells. All of them are restored on [import of the file back into Spreadsheet](loading_data.md#loading-excel-file-xlsx). + :::info DHTMLX Spreadsheet uses the WebAssembly-based library [Json2Excel](https://github.com/dhtmlx/json2excel) to export data to Excel. [Check the details](loading_data.md#exporting-data). ::: diff --git a/docs/api/spreadsheet_lock_method.md b/docs/api/spreadsheet_lock_method.md index a4a80df4..d364565b 100644 --- a/docs/api/spreadsheet_lock_method.md +++ b/docs/api/spreadsheet_lock_method.md @@ -48,4 +48,6 @@ where `sheet1` is the name of the tab. If the name of the tab isn't specified, the method locks the cell(s) of the active tab. ::: -**Related sample**: [Spreadsheet. Locked Cells](https://snippet.dhtmlx.com/czeyiuf8) \ No newline at end of file +**Related sample**: [Spreadsheet. Locked Cells](https://snippet.dhtmlx.com/czeyiuf8) + +**Related article:** [Locking cells](working_with_cells.md#locking-cells) \ No newline at end of file diff --git a/docs/api/spreadsheet_serialize_method.md b/docs/api/spreadsheet_serialize_method.md index 4759b1f6..a2fb0977 100644 --- a/docs/api/spreadsheet_serialize_method.md +++ b/docs/api/spreadsheet_serialize_method.md @@ -13,22 +13,83 @@ description: You can learn about the serialize method in the documentation of th ### Usage ~~~jsx -serialize(): object; +serialize(): { + sheets: [ + { + name: string, + id: string, + data: [ + { + cell: string, + value?: string | number, + css?: string, + format?: string, + editor?: { + type: string, // type: "select" + options: string | array + }, + locked?: boolean, + link?: { + text?: string, + href: string + } + }, + // more cell objects + ], + cols: [ + { + width: number, + hidden: boolean + }, + // more column objects + ], + rows: [ + { + height: number, + hidden: boolean + }, + // more row objects + ], + merged: [ + { + from: { column: number, row: number }, + to: { column: number, row: number } + }, + // more objects + ], + freeze: { + col: number, + row: number + } + }, + // more sheet objects + ], + styles: object, + formats: array +}; ~~~ ### Returns -The method returns a serialized JSON object - -The serialized data is an object with the following attributes: +The method returns a serialized JSON object with the following attributes: - `formats` - an array of objects with number formats -- `styles` - an object with the applied CSS classes +- `styles` - an object with the applied CSS classes, where a key is the name of a class and a value is an object with its style properties - `sheets` - an array of sheet objects. Each object contains the following attributes: - - `name` - the sheet name - - `data` - an array of data objects - - `rows` - an array of height objects - - `cols` - an array of width objects + - `name` - the sheet name + - `id` - the sheet id + - `data` - an array of cell objects. Each object contains the `cell` attribute with the cell id and the attributes that were set for the cell: `value`, `css`, `format`, `editor`, `locked`, `link` + - `cols` - an array of objects with columns configurations. Each object contains the `width` and `hidden` attributes + - `rows` - an array of objects with rows configurations. Each object contains the `height` and `hidden` attributes + - `merged` - an array of objects where each object defines a range of merged cells via the `from` and `to` attributes + - `freeze` - an object with the number of fixed columns and rows, `{ col: 0, row: 0 }` if nothing is frozen + +Note that: + +- the `merged` and `freeze` attributes are always present in a sheet object, as well as the `hidden` attribute in a column or row object, which is `false` when the column or row is visible +- the `cols` and `rows` arrays cover the data range of a sheet and are extended further if a column width, a row height, or a `hidden` state was changed beyond that range. Thus custom sizes of empty columns and rows are kept as well +- a cell gets into the `data` array if it has a value, a CSS class, an editor, or the `locked` state. Thus locked empty cells are kept as well +- the returned object can be passed to the [](api/spreadsheet_parse_method.md) method as is ### Example @@ -36,7 +97,7 @@ The serialized data is an object with the following attributes: const spreadsheet = new dhx.Spreadsheet("spreadsheet", {}); spreadsheet.parse(data); -const data = spreadsheet.serialize(); +const state = spreadsheet.serialize(); ~~~ **Related article:** [Data loading and export](loading_data.md#saving-and-restoring-state) diff --git a/docs/loading_data.md b/docs/loading_data.md index a471319b..0dcc8ebf 100644 --- a/docs/loading_data.md +++ b/docs/loading_data.md @@ -136,6 +136,8 @@ const dataset = [ Check the full list of available cell properties in the [API reference](api/spreadsheet_parse_method.md#parameters). +The locked state is a part of the spreadsheet data. It is included into the object returned by the [](api/spreadsheet_serialize_method.md) method, even if a locked cell is empty, and it is kept when data is [exported into an Excel file](#export-into-excel) and [imported back](#loading-excel-file-xlsx). + **Related sample**: [Spreadsheet. Locked cells](https://snippet.dhtmlx.com/czeyiuf8?tag=spreadsheet) ### Adding a link into a cell @@ -239,6 +241,8 @@ spreadsheet.load("../common/data.xlsx", "xlsx"); {{note Note that the component supports import from Excel files with the `.xlsx` extension only.}} +Along with cell values, import restores the cell styles, the number formats, the merged cells, the links, the data validation lists (as drop-down editors), and the [locked state of cells](#setting-the-locked-state-for-a-cell). + **Related sample**: [Spreadsheet. Import Xlsx](https://snippet.dhtmlx.com/cqlpy828?tag=spreadsheet) You can also [export data from a spreadsheet into an Excel file](#exporting-data), if needed. @@ -268,7 +272,7 @@ For details on how to load multiple sheets into the spreadsheet, see the [Work w ## Saving and restoring state -To save the current state of a spreadsheet, use the [](api/spreadsheet_serialize_method.md) method. It converts data into an array of JSON objects. Each JSON object contains the configuration of a cell. +To save the current state of a spreadsheet, use the [](api/spreadsheet_serialize_method.md) method. It converts the spreadsheet into a JSON object with the `sheets`, `styles`, and `formats` attributes. Besides cell values, the saved state includes the applied styles and number formats, the merged cells, the frozen columns and rows, the locked cells, and the custom sizes and visibility of columns and rows. ~~~jsx // saving state of the spreadsheet1 @@ -328,6 +332,8 @@ spreadsheet.export.xlsx(); **Related sample**: [Spreadsheet. Export Xlsx](https://snippet.dhtmlx.com/btyo3j8s?tag=spreadsheet) +Besides cell values, an exported file keeps the styles applied to cells, the number formats, the merged cells, the frozen columns and rows, the links added into cells, the drop-down editors (as Excel data validation), and the [locked state of cells](#setting-the-locked-state-for-a-cell). All of them are restored when the file is [imported back into Spreadsheet](#loading-excel-file-xlsx). + :::note Please note that the component supports export to Excel files with the `.xlsx` extension only. ::: diff --git a/docs/working_with_cells.md b/docs/working_with_cells.md index 2bcc69ed..b92c6f2f 100644 --- a/docs/working_with_cells.md +++ b/docs/working_with_cells.md @@ -208,6 +208,15 @@ var cellsLocked = spreadsheet.isLocked("A1,B5,B7,D4:D6"); The method returns `true` or `false` depending on the state of the cell. If several cells are checked at once, the method returns `true` if there is at least one locked cell among the specified cells. +### Saving the locked state + +The locked state of cells is a part of the spreadsheet data, so it survives saving and restoring: + +- the [](api/spreadsheet_serialize_method.md) method includes the `locked` property into the serialized cell objects, even if a locked cell has no value +- [export into an Excel file](loading_data.md#export-into-excel) keeps the locked state, and [import of such a file](loading_data.md#loading-excel-file-xlsx) restores it + +You can also set the locked state right in a data set via the `locked` property of a cell. [Check the details](loading_data.md#setting-the-locked-state-for-a-cell). + ## Merging cells ### Merge cells diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md b/i18n/de/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md index fbf844a1..f546c0e9 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md @@ -39,6 +39,8 @@ spreadsheet.export.xlsx("MyData"); Beachten Sie, dass die Komponente den Export in Excel-Dateien ausschließlich mit der Erweiterung `.xlsx` unterstützt. ::: +Neben den Zellwerten behält eine exportierte Datei die Zellstile, die Zahlenformate, die verbundenen Zellen, die fixierten Spalten und Zeilen, die Links, die Dropdown-Editoren und den gesperrten Zustand der Zellen bei. All dies wird beim [Reimport der Datei in Spreadsheet](loading_data.md#loading-excel-file-xlsx) wiederhergestellt. + :::info DHTMLX Spreadsheet verwendet die WebAssembly-basierte Bibliothek [Json2Excel](https://github.com/dhtmlx/json2excel) für den Export von Daten nach Excel. [Weitere Details](loading_data.md#exporting-data). ::: diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md b/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md index ed7ce42f..e2abaaa9 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md @@ -49,3 +49,5 @@ Wenn der Name des Tabs nicht angegeben wird, sperrt die Methode die Zelle(n) des ::: **Verwandtes Beispiel**: [Spreadsheet. Gesperrte Zellen](https://snippet.dhtmlx.com/czeyiuf8) + +**Verwandter Artikel:** [Zellen sperren](working_with_cells.md#locking-cells) \ No newline at end of file diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md b/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md index 4d4c8475..858c017f 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md @@ -13,22 +13,83 @@ description: In der Dokumentation der DHTMLX JavaScript Spreadsheet-Bibliothek e ### Verwendung {#usage} ~~~jsx -serialize(): object; +serialize(): { + sheets: [ + { + name: string, + id: string, + data: [ + { + cell: string, + value?: string | number, + css?: string, + format?: string, + editor?: { + type: string, // type: "select" + options: string | array + }, + locked?: boolean, + link?: { + text?: string, + href: string + } + }, + // more cell objects + ], + cols: [ + { + width: number, + hidden: boolean + }, + // more column objects + ], + rows: [ + { + height: number, + hidden: boolean + }, + // more row objects + ], + merged: [ + { + from: { column: number, row: number }, + to: { column: number, row: number } + }, + // more objects + ], + freeze: { + col: number, + row: number + } + }, + // more sheet objects + ], + styles: object, + formats: array +}; ~~~ ### Rückgabewert {#returns} -Die Methode gibt ein serialisiertes JSON-Objekt zurück - -Die serialisierten Daten sind ein Objekt mit den folgenden Attributen: +Die Methode gibt ein serialisiertes JSON-Objekt mit den folgenden Attributen zurück: - `formats` - ein Array von Objekten mit Zahlenformaten -- `styles` - ein Objekt mit den angewendeten CSS-Klassen +- `styles` - ein Objekt mit den angewendeten CSS-Klassen, wobei ein Schlüssel der Name einer Klasse und ein Wert ein Objekt mit deren Stileigenschaften ist - `sheets` - ein Array von Tabellenblatt-Objekten. Jedes Objekt enthält die folgenden Attribute: - - `name` - der Name des Tabellenblatts - - `data` - ein Array von Datenobjekten - - `rows` - ein Array von Höhenobjekten - - `cols` - ein Array von Breitobjekten + - `name` - der Name des Tabellenblatts + - `id` - die ID des Tabellenblatts + - `data` - ein Array von Zellobjekten. Jedes Objekt enthält das Attribut `cell` mit der Zell-ID sowie die Attribute, die für die Zelle gesetzt wurden: `value`, `css`, `format`, `editor`, `locked`, `link` + - `cols` - ein Array von Objekten mit Spaltenkonfigurationen. Jedes Objekt enthält die Attribute `width` und `hidden` + - `rows` - ein Array von Objekten mit Zeilenkonfigurationen. Jedes Objekt enthält die Attribute `height` und `hidden` + - `merged` - ein Array von Objekten, wobei jedes Objekt über die Attribute `from` und `to` einen Bereich verbundener Zellen definiert + - `freeze` - ein Objekt mit der Anzahl der fixierten Spalten und Zeilen, `{ col: 0, row: 0 }`, wenn nichts fixiert ist + +Beachten Sie: + +- die Attribute `merged` und `freeze` sind immer im Tabellenblatt-Objekt vorhanden, ebenso wie das Attribut `hidden` im Spalten- oder Zeilenobjekt, das `false` ist, wenn die Spalte oder Zeile sichtbar ist +- die Arrays `cols` und `rows` decken den Datenbereich eines Tabellenblatts ab und werden darüber hinaus erweitert, wenn eine Spaltenbreite, eine Zeilenhöhe oder ein `hidden`-Zustand außerhalb dieses Bereichs geändert wurde. So bleiben auch benutzerdefinierte Größen leerer Spalten und Zeilen erhalten +- eine Zelle gelangt in das Array `data`, wenn sie einen Wert, eine CSS-Klasse, einen Editor oder den Zustand `locked` hat. So bleiben auch gesperrte leere Zellen erhalten +- das zurückgegebene Objekt kann unverändert an die Methode [](api/spreadsheet_parse_method.md) übergeben werden ### Beispiel {#example} @@ -36,7 +97,7 @@ Die serialisierten Daten sind ein Objekt mit den folgenden Attributen: const spreadsheet = new dhx.Spreadsheet("spreadsheet", {}); spreadsheet.parse(data); -const data = spreadsheet.serialize(); +const state = spreadsheet.serialize(); ~~~ **Verwandter Artikel:** [Datenladen und -export](loading_data.md#saving-and-restoring-state) diff --git a/i18n/de/docusaurus-plugin-content-docs/current/loading_data.md b/i18n/de/docusaurus-plugin-content-docs/current/loading_data.md index ce2c0306..61905041 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/loading_data.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/loading_data.md @@ -136,6 +136,8 @@ const dataset = [ Die vollständige Liste der verfügbaren Zell-Eigenschaften finden Sie in der [API-Referenz](api/spreadsheet_parse_method.md#parameters). +Der gesperrte Zustand ist Teil der Spreadsheet-Daten. Er wird in das von der Methode [](api/spreadsheet_serialize_method.md) zurückgegebene Objekt aufgenommen, auch wenn eine gesperrte Zelle leer ist, und er bleibt beim [Export der Daten in eine Excel-Datei](#export-into-excel) und beim [Reimport](#loading-excel-file-xlsx) erhalten. + **Verwandtes Beispiel**: [Spreadsheet. Gesperrte Zellen](https://snippet.dhtmlx.com/czeyiuf8?tag=spreadsheet) ### Einen Link in eine Zelle einfügen {#adding-a-link-into-a-cell} @@ -239,6 +241,8 @@ spreadsheet.load("../common/data.xlsx", "xlsx"); {{note Beachten Sie, dass die Komponente nur den Import aus Excel-Dateien mit der Erweiterung `.xlsx` unterstützt.}} +Neben den Zellwerten stellt der Import die Zellstile, die Zahlenformate, die verbundenen Zellen, die Links, die Datenüberprüfungslisten (als Dropdown-Editoren) und den [gesperrten Zustand der Zellen](#setting-the-locked-state-for-a-cell) wieder her. + **Verwandtes Beispiel**: [Spreadsheet. Xlsx importieren](https://snippet.dhtmlx.com/cqlpy828?tag=spreadsheet) Sie können bei Bedarf auch [Daten aus einem Spreadsheet in eine Excel-Datei exportieren](#exporting-data). @@ -268,7 +272,7 @@ Einzelheiten zum Laden mehrerer Tabellenblätter in das Spreadsheet finden Sie i ## Zustand speichern und wiederherstellen {#saving-and-restoring-state} -Um den aktuellen Zustand eines Spreadsheets zu speichern, verwenden Sie die Methode [](api/spreadsheet_serialize_method.md). Sie konvertiert Daten in ein Array von JSON-Objekten. Jedes JSON-Objekt enthält die Konfiguration einer Zelle. +Um den aktuellen Zustand eines Spreadsheets zu speichern, verwenden Sie die Methode [](api/spreadsheet_serialize_method.md). Sie konvertiert das Spreadsheet in ein JSON-Objekt mit den Attributen `sheets`, `styles` und `formats`. Neben den Zellwerten enthält der gespeicherte Zustand die angewendeten Stile und Zahlenformate, die verbundenen Zellen, die fixierten Spalten und Zeilen, die gesperrten Zellen sowie die benutzerdefinierten Größen und die Sichtbarkeit von Spalten und Zeilen. ~~~jsx // Zustand von spreadsheet1 speichern @@ -328,6 +332,8 @@ spreadsheet.export.xlsx(); **Verwandtes Beispiel**: [Spreadsheet. Xlsx exportieren](https://snippet.dhtmlx.com/btyo3j8s?tag=spreadsheet) +Neben den Zellwerten behält eine exportierte Datei die auf Zellen angewendeten Stile, die Zahlenformate, die verbundenen Zellen, die fixierten Spalten und Zeilen, die in Zellen eingefügten Links, die Dropdown-Editoren (als Excel-Datenüberprüfung) und den [gesperrten Zustand der Zellen](#setting-the-locked-state-for-a-cell) bei. All dies wird wiederhergestellt, wenn die Datei [zurück in Spreadsheet importiert wird](#loading-excel-file-xlsx). + :::note Bitte beachten Sie, dass die Komponente nur den Export in Excel-Dateien mit der Erweiterung `.xlsx` unterstützt. ::: diff --git a/i18n/de/docusaurus-plugin-content-docs/current/working_with_cells.md b/i18n/de/docusaurus-plugin-content-docs/current/working_with_cells.md index de569496..9a6be8f4 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/working_with_cells.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/working_with_cells.md @@ -208,6 +208,15 @@ var cellsLocked = spreadsheet.isLocked("A1,B5,B7,D4:D6"); Die Methode gibt `true` oder `false` zurück, abhängig vom Zustand der Zelle. Wenn mehrere Zellen gleichzeitig geprüft werden, gibt die Methode `true` zurück, wenn mindestens eine gesperrte Zelle unter den angegebenen Zellen vorhanden ist. +### Speichern des gesperrten Zustands {#saving-the-locked-state} + +Der gesperrte Zustand der Zellen ist Teil der Spreadsheet-Daten und bleibt daher beim Speichern und Wiederherstellen erhalten: + +- die Methode [](api/spreadsheet_serialize_method.md) nimmt die Eigenschaft `locked` in die serialisierten Zellobjekte auf, auch wenn eine gesperrte Zelle keinen Wert hat +- der [Export in eine Excel-Datei](loading_data.md#export-into-excel) behält den gesperrten Zustand bei, und der [Import einer solchen Datei](loading_data.md#loading-excel-file-xlsx) stellt ihn wieder her + +Sie können den gesperrten Zustand auch direkt im Datensatz über die Eigenschaft `locked` einer Zelle festlegen. [Weitere Details](loading_data.md#setting-the-locked-state-for-a-cell). + ## Zellen zusammenführen {#merging-cells} ### Zellen zusammenführen {#merge-cells} diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md b/i18n/ko/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md index c1a9c5f2..ce29cf0e 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md @@ -39,6 +39,8 @@ spreadsheet.export.xlsx("MyData"); 컴포넌트는 `.xlsx` 확장자를 가진 Excel 파일로의 내보내기만 지원합니다. ::: +내보낸 파일은 셀 값 외에도 셀 스타일, 숫자 형식, 병합된 셀, 고정된 열과 행, 링크, 드롭다운 에디터, 셀의 잠금 상태를 유지합니다. 이 모든 것은 [파일을 다시 Spreadsheet로 가져올 때](loading_data.md#loading-excel-file-xlsx) 복원됩니다. + :::info DHTMLX Spreadsheet는 WebAssembly 기반 라이브러리 [Json2Excel](https://github.com/dhtmlx/json2excel)을 사용하여 Excel로 데이터를 내보냅니다. [자세한 내용을 확인하세요](loading_data.md#exporting-data). ::: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md b/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md index 5d285ff9..2f63b7c6 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md @@ -49,3 +49,5 @@ spreadsheet.lock("sheet1!A2"); ::: **관련 샘플**: [Spreadsheet. Locked Cells](https://snippet.dhtmlx.com/czeyiuf8) + +**관련 문서:** [셀 잠금](working_with_cells.md#locking-cells) \ No newline at end of file diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md b/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md index bcca0893..a4a16ad6 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md @@ -13,22 +13,83 @@ description: DHTMLX JavaScript Spreadsheet 라이브러리 문서에서 serializ ### 사용법 {#usage} ~~~jsx -serialize(): object; +serialize(): { + sheets: [ + { + name: string, + id: string, + data: [ + { + cell: string, + value?: string | number, + css?: string, + format?: string, + editor?: { + type: string, // type: "select" + options: string | array + }, + locked?: boolean, + link?: { + text?: string, + href: string + } + }, + // more cell objects + ], + cols: [ + { + width: number, + hidden: boolean + }, + // more column objects + ], + rows: [ + { + height: number, + hidden: boolean + }, + // more row objects + ], + merged: [ + { + from: { column: number, row: number }, + to: { column: number, row: number } + }, + // more objects + ], + freeze: { + col: number, + row: number + } + }, + // more sheet objects + ], + styles: object, + formats: array +}; ~~~ ### 반환값 {#returns} -이 메서드는 직렬화된 JSON 객체를 반환합니다 - -직렬화된 데이터는 다음 속성을 가진 객체입니다: +이 메서드는 다음 속성을 가진 직렬화된 JSON 객체를 반환합니다: - `formats` - 숫자 형식 객체 배열 -- `styles` - 적용된 CSS 클래스를 담은 객체 +- `styles` - 적용된 CSS 클래스를 담은 객체로, 키는 클래스 이름이고 값은 해당 클래스의 스타일 속성을 담은 객체입니다 - `sheets` - 시트 객체 배열. 각 객체는 다음 속성을 포함합니다: - - `name` - 시트 이름 - - `data` - 데이터 객체 배열 - - `rows` - 높이 객체 배열 - - `cols` - 너비 객체 배열 + - `name` - 시트 이름 + - `id` - 시트 id + - `data` - 셀 객체 배열. 각 객체는 셀 id가 담긴 `cell` 속성과 해당 셀에 지정된 속성인 `value`, `css`, `format`, `editor`, `locked`, `link`를 포함합니다 + - `cols` - 열 구성 객체 배열. 각 객체는 `width`와 `hidden` 속성을 포함합니다 + - `rows` - 행 구성 객체 배열. 각 객체는 `height`와 `hidden` 속성을 포함합니다 + - `merged` - 객체 배열로, 각 객체는 `from`과 `to` 속성으로 병합된 셀 범위를 정의합니다 + - `freeze` - 고정된 열과 행의 개수를 담은 객체이며, 고정된 것이 없으면 `{ col: 0, row: 0 }`입니다 + +다음 사항에 유의하세요: + +- `merged`와 `freeze` 속성은 시트 객체에 항상 포함되며, 열 또는 행 객체의 `hidden` 속성도 마찬가지로 항상 포함되고 열이나 행이 보이는 상태이면 `false`입니다 +- `cols`와 `rows` 배열은 시트의 데이터 범위를 포함하며, 해당 범위를 벗어난 곳에서 열 너비, 행 높이 또는 `hidden` 상태가 변경된 경우 그만큼 더 확장됩니다. 따라서 비어 있는 열과 행의 사용자 지정 크기도 유지됩니다 +- 셀은 값, CSS 클래스, 에디터 또는 `locked` 상태를 가진 경우에만 `data` 배열에 포함됩니다. 따라서 잠긴 빈 셀도 유지됩니다 +- 반환된 객체는 그대로 [](api/spreadsheet_parse_method.md) 메서드에 전달할 수 있습니다 ### 예제 {#example} @@ -36,7 +97,7 @@ serialize(): object; const spreadsheet = new dhx.Spreadsheet("spreadsheet", {}); spreadsheet.parse(data); -const data = spreadsheet.serialize(); +const state = spreadsheet.serialize(); ~~~ **관련 문서:** [데이터 로드 및 내보내기](loading_data.md#saving-and-restoring-state) diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/loading_data.md b/i18n/ko/docusaurus-plugin-content-docs/current/loading_data.md index 7e2f626d..e0fbf8bf 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/loading_data.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/loading_data.md @@ -136,6 +136,8 @@ const dataset = [ 사용 가능한 셀 속성의 전체 목록은 [API 레퍼런스](api/spreadsheet_parse_method.md#parameters)에서 확인하십시오. +잠금 상태는 스프레드시트 데이터의 일부입니다. 잠긴 셀이 비어 있더라도 [](api/spreadsheet_serialize_method.md) 메서드가 반환하는 객체에 포함되며, 데이터를 [Excel 파일로 내보내고](#export-into-excel) [다시 가져올 때](#loading-excel-file-xlsx)도 유지됩니다. + **관련 샘플**: [Spreadsheet. 잠긴 셀](https://snippet.dhtmlx.com/czeyiuf8?tag=spreadsheet) ### 셀에 링크 추가하기 {#adding-a-link-into-a-cell} @@ -239,6 +241,8 @@ spreadsheet.load("../common/data.xlsx", "xlsx"); {{note 컴포넌트는 `.xlsx` 확장자를 가진 Excel 파일에서만 가져오기를 지원합니다.}} +가져오기는 셀 값과 함께 셀 스타일, 숫자 형식, 병합된 셀, 링크, 데이터 유효성 검사 목록(드롭다운 에디터로), 그리고 [셀의 잠금 상태](#setting-the-locked-state-for-a-cell)를 복원합니다. + **관련 샘플**: [Spreadsheet. Xlsx 가져오기](https://snippet.dhtmlx.com/cqlpy828?tag=spreadsheet) 필요한 경우 [스프레드시트 데이터를 Excel 파일로 내보낼](#exporting-data) 수도 있습니다. @@ -268,7 +272,7 @@ spreadsheet.parse(data); ## 상태 저장 및 복원 {#saving-and-restoring-state} -스프레드시트의 현재 상태를 저장하려면 [](api/spreadsheet_serialize_method.md) 메서드를 사용하십시오. 이 메서드는 데이터를 JSON 객체 배열로 변환합니다. 각 JSON 객체에는 셀의 구성이 포함됩니다. +스프레드시트의 현재 상태를 저장하려면 [](api/spreadsheet_serialize_method.md) 메서드를 사용하십시오. 이 메서드는 스프레드시트를 `sheets`, `styles`, `formats` 속성을 가진 JSON 객체로 변환합니다. 저장된 상태에는 셀 값 외에도 적용된 스타일과 숫자 형식, 병합된 셀, 고정된 열과 행, 잠긴 셀, 그리고 열과 행의 사용자 지정 크기 및 표시 여부가 포함됩니다. ~~~jsx // saving state of the spreadsheet1 @@ -328,6 +332,8 @@ spreadsheet.export.xlsx(); **관련 샘플**: [Spreadsheet. Xlsx 내보내기](https://snippet.dhtmlx.com/btyo3j8s?tag=spreadsheet) +내보낸 파일은 셀 값 외에도 셀에 적용된 스타일, 숫자 형식, 병합된 셀, 고정된 열과 행, 셀에 추가된 링크, 드롭다운 에디터(Excel 데이터 유효성 검사로), 그리고 [셀의 잠금 상태](#setting-the-locked-state-for-a-cell)를 유지합니다. 해당 파일을 [다시 Spreadsheet로 가져오면](#loading-excel-file-xlsx) 이 모든 것이 복원됩니다. + :::note 컴포넌트는 `.xlsx` 확장자를 가진 Excel 파일로만 내보내기를 지원합니다. ::: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/working_with_cells.md b/i18n/ko/docusaurus-plugin-content-docs/current/working_with_cells.md index 0a8466cf..87f16dbb 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/working_with_cells.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/working_with_cells.md @@ -208,6 +208,15 @@ var cellsLocked = spreadsheet.isLocked("A1,B5,B7,D4:D6"); 이 메서드는 셀 상태에 따라 `true` 또는 `false`를 반환합니다. 여러 셀을 한 번에 확인하는 경우 지정된 셀 중 잠긴 셀이 하나 이상 있으면 `true`를 반환합니다. +### 잠금 상태 저장 {#saving-the-locked-state} + +셀의 잠금 상태는 스프레드시트 데이터의 일부이므로 저장하고 복원해도 유지됩니다: + +- [](api/spreadsheet_serialize_method.md) 메서드는 잠긴 셀에 값이 없더라도 직렬화된 셀 객체에 `locked` 속성을 포함합니다 +- [Excel 파일로 내보내기](loading_data.md#export-into-excel)는 잠금 상태를 유지하며, [해당 파일을 가져오면](loading_data.md#loading-excel-file-xlsx) 잠금 상태가 복원됩니다 + +셀의 `locked` 속성을 사용하여 데이터 세트에서 직접 잠금 상태를 지정할 수도 있습니다. [자세한 내용을 확인하세요](loading_data.md#setting-the-locked-state-for-a-cell). + ## 셀 병합 {#merging-cells} ### 셀 병합 {#merge-cells} diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md index 16fc3e9e..f48da645 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md @@ -39,6 +39,8 @@ spreadsheet.export.xlsx("MyData"); Обратите внимание, что компонент поддерживает экспорт только в файлы Excel с расширением `.xlsx`. ::: +Помимо значений ячеек, экспортированный файл сохраняет стили ячеек, числовые форматы, объединённые ячейки, зафиксированные столбцы и строки, ссылки, выпадающие редакторы и заблокированное состояние ячеек. Всё это восстанавливается при [обратном импорте файла в Spreadsheet](loading_data.md#loading-excel-file-xlsx). + :::info DHTMLX Spreadsheet использует библиотеку на основе WebAssembly [Json2Excel](https://github.com/dhtmlx/json2excel) для экспорта данных в Excel. [Подробнее](loading_data.md#exporting-data). ::: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md index 610e3da7..21a1d3c4 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md @@ -49,3 +49,5 @@ spreadsheet.lock("sheet1!A2"); ::: **Связанный пример**: [Spreadsheet. Locked Cells](https://snippet.dhtmlx.com/czeyiuf8) + +**Полезная статья:** [Блокировка ячеек](working_with_cells.md#locking-cells) \ No newline at end of file diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md index 9381b134..ae9a937f 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md @@ -13,22 +13,83 @@ description: Вы можете узнать о методе serialize в док ### Использование {#usage} ~~~jsx -serialize(): object; +serialize(): { + sheets: [ + { + name: string, + id: string, + data: [ + { + cell: string, + value?: string | number, + css?: string, + format?: string, + editor?: { + type: string, // type: "select" + options: string | array + }, + locked?: boolean, + link?: { + text?: string, + href: string + } + }, + // more cell objects + ], + cols: [ + { + width: number, + hidden: boolean + }, + // more column objects + ], + rows: [ + { + height: number, + hidden: boolean + }, + // more row objects + ], + merged: [ + { + from: { column: number, row: number }, + to: { column: number, row: number } + }, + // more objects + ], + freeze: { + col: number, + row: number + } + }, + // more sheet objects + ], + styles: object, + formats: array +}; ~~~ ### Возвращаемое значение {#returns} -Метод возвращает сериализованный JSON-объект - -Сериализованные данные представляют собой объект со следующими атрибутами: +Метод возвращает сериализованный JSON-объект со следующими атрибутами: - `formats` - массив объектов с числовыми форматами -- `styles` - объект с применёнными CSS-классами +- `styles` - объект с применёнными CSS-классами, где ключ - это имя класса, а значение - объект с его свойствами стиля - `sheets` - массив объектов листов. Каждый объект содержит следующие атрибуты: - - `name` - имя листа - - `data` - массив объектов данных - - `rows` - массив объектов высоты строк - - `cols` - массив объектов ширины столбцов + - `name` - имя листа + - `id` - идентификатор листа + - `data` - массив объектов ячеек. Каждый объект содержит атрибут `cell` с идентификатором ячейки и атрибуты, которые были заданы для ячейки: `value`, `css`, `format`, `editor`, `locked`, `link` + - `cols` - массив объектов с конфигурациями столбцов. Каждый объект содержит атрибуты `width` и `hidden` + - `rows` - массив объектов с конфигурациями строк. Каждый объект содержит атрибуты `height` и `hidden` + - `merged` - массив объектов, каждый из которых определяет диапазон объединённых ячеек через атрибуты `from` и `to` + - `freeze` - объект с количеством фиксированных столбцов и строк, `{ col: 0, row: 0 }`, если ничего не зафиксировано + +Обратите внимание: + +- атрибуты `merged` и `freeze` всегда присутствуют в объекте листа, как и атрибут `hidden` в объекте столбца или строки, который равен `false`, когда столбец или строка видимы +- массивы `cols` и `rows` охватывают диапазон данных листа и расширяются дальше, если ширина столбца, высота строки или состояние `hidden` были изменены за пределами этого диапазона. Таким образом, пользовательские размеры пустых столбцов и строк также сохраняются +- ячейка попадает в массив `data`, если у неё есть значение, CSS-класс, редактор или состояние `locked`. Таким образом, заблокированные пустые ячейки также сохраняются +- возвращаемый объект можно передать в метод [](api/spreadsheet_parse_method.md) без изменений ### Пример {#example} @@ -36,7 +97,7 @@ serialize(): object; const spreadsheet = new dhx.Spreadsheet("spreadsheet", {}); spreadsheet.parse(data); -const data = spreadsheet.serialize(); +const state = spreadsheet.serialize(); ~~~ **Полезная статья:** [Загрузка и экспорт данных](loading_data.md#saving-and-restoring-state) diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/loading_data.md b/i18n/ru/docusaurus-plugin-content-docs/current/loading_data.md index b52ea3c7..920cdad0 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/loading_data.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/loading_data.md @@ -136,6 +136,8 @@ const dataset = [ Ознакомьтесь с полным списком доступных свойств ячеек в [справочнике API](api/spreadsheet_parse_method.md#parameters). +Заблокированное состояние является частью данных таблицы. Оно включается в объект, возвращаемый методом [](api/spreadsheet_serialize_method.md), даже если заблокированная ячейка пуста, и сохраняется при [экспорте данных в файл Excel](#export-into-excel) и [обратном импорте](#loading-excel-file-xlsx). + **Связанный пример**: [Spreadsheet. Заблокированные ячейки](https://snippet.dhtmlx.com/czeyiuf8?tag=spreadsheet) ### Добавление ссылки в ячейку {#adding-a-link-into-a-cell} @@ -239,6 +241,8 @@ spreadsheet.load("../common/data.xlsx", "xlsx"); {{note Обратите внимание, что компонент поддерживает импорт только из файлов Excel с расширением `.xlsx`.}} +Наряду со значениями ячеек импорт восстанавливает стили ячеек, числовые форматы, объединённые ячейки, ссылки, списки проверки данных (в виде выпадающих редакторов) и [заблокированное состояние ячеек](#setting-the-locked-state-for-a-cell). + **Связанный пример**: [Spreadsheet. Импорт Xlsx](https://snippet.dhtmlx.com/cqlpy828?tag=spreadsheet) При необходимости вы также можете [экспортировать данные из таблицы в файл Excel](#exporting-data). @@ -268,7 +272,7 @@ spreadsheet.parse(data); ## Сохранение и восстановление состояния {#saving-and-restoring-state} -Чтобы сохранить текущее состояние таблицы, используйте метод [](api/spreadsheet_serialize_method.md). Он преобразует данные в массив JSON-объектов. Каждый JSON-объект содержит конфигурацию ячейки. +Чтобы сохранить текущее состояние таблицы, используйте метод [](api/spreadsheet_serialize_method.md). Он преобразует таблицу в JSON-объект с атрибутами `sheets`, `styles` и `formats`. Помимо значений ячеек, сохранённое состояние включает применённые стили и числовые форматы, объединённые ячейки, зафиксированные столбцы и строки, заблокированные ячейки, а также пользовательские размеры и видимость столбцов и строк. ~~~jsx // saving state of the spreadsheet1 @@ -328,6 +332,8 @@ spreadsheet.export.xlsx(); **Связанный пример**: [Spreadsheet. Экспорт Xlsx](https://snippet.dhtmlx.com/btyo3j8s?tag=spreadsheet) +Помимо значений ячеек, экспортированный файл сохраняет применённые к ячейкам стили, числовые форматы, объединённые ячейки, зафиксированные столбцы и строки, добавленные в ячейки ссылки, выпадающие редакторы (в виде проверки данных Excel) и [заблокированное состояние ячеек](#setting-the-locked-state-for-a-cell). Всё это восстанавливается при [обратном импорте файла в Spreadsheet](#loading-excel-file-xlsx). + :::note Обратите внимание, что компонент поддерживает экспорт только в файлы Excel с расширением `.xlsx`. ::: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/working_with_cells.md b/i18n/ru/docusaurus-plugin-content-docs/current/working_with_cells.md index 0148b50e..9db67c52 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/working_with_cells.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/working_with_cells.md @@ -208,6 +208,15 @@ var cellsLocked = spreadsheet.isLocked("A1,B5,B7,D4:D6"); Метод возвращает `true` или `false` в зависимости от состояния ячейки. Если проверяется несколько ячеек одновременно, метод возвращает `true`, если среди указанных ячеек есть хотя бы одна заблокированная. +### Сохранение заблокированного состояния {#saving-the-locked-state} + +Заблокированное состояние ячеек является частью данных таблицы, поэтому оно не теряется при сохранении и восстановлении: + +- метод [](api/spreadsheet_serialize_method.md) включает свойство `locked` в сериализованные объекты ячеек, даже если у заблокированной ячейки нет значения +- [экспорт в файл Excel](loading_data.md#export-into-excel) сохраняет заблокированное состояние, а [импорт такого файла](loading_data.md#loading-excel-file-xlsx) восстанавливает его + +Заблокированное состояние также можно задать прямо в наборе данных через свойство `locked` ячейки. [Подробнее](loading_data.md#setting-the-locked-state-for-a-cell). + ## Объединение ячеек {#merging-cells} ### Объединение ячеек {#merge-cells} diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md index 07964df0..d99ff760 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/export_xlsx_method.md @@ -39,6 +39,8 @@ spreadsheet.export.xlsx("MyData"); 请注意，该组件仅支持导出扩展名为 `.xlsx` 的 Excel 文件。 ::: +除单元格值外，导出的文件还会保留单元格样式、数字格式、合并单元格、固定的列和行、链接、下拉编辑器以及单元格的锁定状态。[将该文件重新导入 Spreadsheet](loading_data.md#loading-excel-file-xlsx) 时，这些内容都会被恢复。 + :::info DHTMLX Spreadsheet 使用基于 WebAssembly 的库 [Json2Excel](https://github.com/dhtmlx/json2excel) 将数据导出为 Excel。[查看详情](loading_data.md#exporting-data)。 ::: diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md index dec10aef..19c413b0 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_lock_method.md @@ -49,3 +49,5 @@ spreadsheet.lock("sheet1!A2"); ::: **相关示例**：[Spreadsheet. 锁定单元格](https://snippet.dhtmlx.com/czeyiuf8) + +**相关文章：** [锁定单元格](working_with_cells.md#locking-cells) \ No newline at end of file diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md index 0e3c4bf2..f1fd1ded 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/spreadsheet_serialize_method.md @@ -13,22 +13,83 @@ description: 您可以在 DHTMLX JavaScript Spreadsheet 库的文档中了解 se ### 用法 {#usage} ~~~jsx -serialize(): object; +serialize(): { + sheets: [ + { + name: string, + id: string, + data: [ + { + cell: string, + value?: string | number, + css?: string, + format?: string, + editor?: { + type: string, // type: "select" + options: string | array + }, + locked?: boolean, + link?: { + text?: string, + href: string + } + }, + // more cell objects + ], + cols: [ + { + width: number, + hidden: boolean + }, + // more column objects + ], + rows: [ + { + height: number, + hidden: boolean + }, + // more row objects + ], + merged: [ + { + from: { column: number, row: number }, + to: { column: number, row: number } + }, + // more objects + ], + freeze: { + col: number, + row: number + } + }, + // more sheet objects + ], + styles: object, + formats: array +}; ~~~ ### 返回值 {#returns} -该方法返回一个序列化后的 JSON 对象 - -序列化后的数据是一个包含以下属性的对象： +该方法返回一个包含以下属性的序列化 JSON 对象： - `formats` - 数字格式对象的数组 -- `styles` - 包含已应用 CSS 类的对象 +- `styles` - 包含已应用 CSS 类的对象，其中键为类名，值为包含该类样式属性的对象 - `sheets` - 工作表对象的数组。每个对象包含以下属性： - - `name` - 工作表名称 - - `data` - 数据对象的数组 - - `rows` - 行高对象的数组 - - `cols` - 列宽对象的数组 + - `name` - 工作表名称 + - `id` - 工作表 id + - `data` - 单元格对象的数组。每个对象包含带有单元格 id 的 `cell` 属性，以及为该单元格设置的属性：`value`、`css`、`format`、`editor`、`locked`、`link` + - `cols` - 列配置对象的数组。每个对象包含 `width` 和 `hidden` 属性 + - `rows` - 行配置对象的数组。每个对象包含 `height` 和 `hidden` 属性 + - `merged` - 对象数组，其中每个对象通过 `from` 和 `to` 属性定义一个合并单元格区域 + - `freeze` - 包含固定列数和行数的对象，若未固定任何内容则为 `{ col: 0, row: 0 }` + +请注意： + +- `merged` 和 `freeze` 属性始终存在于工作表对象中，列或行对象中的 `hidden` 属性也是如此，当列或行可见时该属性为 `false` +- `cols` 和 `rows` 数组覆盖工作表的数据范围，如果在该范围之外修改了列宽、行高或 `hidden` 状态，数组会继续扩展。因此空列和空行的自定义尺寸也会被保留 +- 单元格在具有值、CSS 类、编辑器或 `locked` 状态时才会进入 `data` 数组。因此被锁定的空单元格也会被保留 +- 返回的对象可以原样传递给 [](api/spreadsheet_parse_method.md) 方法 ### 示例 {#example} @@ -36,7 +97,7 @@ serialize(): object; const spreadsheet = new dhx.Spreadsheet("spreadsheet", {}); spreadsheet.parse(data); -const data = spreadsheet.serialize(); +const state = spreadsheet.serialize(); ~~~ **相关文章：** [数据加载与导出](loading_data.md#saving-and-restoring-state) diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/loading_data.md b/i18n/zh/docusaurus-plugin-content-docs/current/loading_data.md index 95789989..8ac62ceb 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/loading_data.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/loading_data.md @@ -136,6 +136,8 @@ const dataset = [ 请在 [API 参考](api/spreadsheet_parse_method.md#parameters)中查阅可用单元格属性的完整列表。 +锁定状态是电子表格数据的一部分。即使被锁定的单元格为空，它也会包含在 [](api/spreadsheet_serialize_method.md) 方法返回的对象中，并且在数据[导出为 Excel 文件](#export-into-excel)以及[重新导入](#loading-excel-file-xlsx)时都会保留。 + **相关示例**：[Spreadsheet. 锁定单元格](https://snippet.dhtmlx.com/czeyiuf8?tag=spreadsheet) ### 在单元格中添加链接 {#adding-a-link-into-a-cell} @@ -239,6 +241,8 @@ spreadsheet.load("../common/data.xlsx", "xlsx"); {{note 请注意，该组件仅支持从 `.xlsx` 扩展名的 Excel 文件导入。}} +除单元格值外，导入还会恢复单元格样式、数字格式、合并单元格、链接、数据验证列表（作为下拉编辑器）以及[单元格的锁定状态](#setting-the-locked-state-for-a-cell)。 + **相关示例**：[Spreadsheet. 导入 Xlsx](https://snippet.dhtmlx.com/cqlpy828?tag=spreadsheet) 如有需要，您也可以[将电子表格中的数据导出为 Excel 文件](#exporting-data)。 @@ -268,7 +272,7 @@ spreadsheet.parse(data); ## 保存与恢复状态 {#saving-and-restoring-state} -要保存电子表格的当前状态，请使用 [](api/spreadsheet_serialize_method.md) 方法。该方法将数据转换为 JSON 对象数组，每个 JSON 对象包含一个单元格的配置。 +要保存电子表格的当前状态，请使用 [](api/spreadsheet_serialize_method.md) 方法。该方法将电子表格转换为包含 `sheets`、`styles` 和 `formats` 属性的 JSON 对象。除单元格值外，保存的状态还包括已应用的样式和数字格式、合并单元格、固定的列和行、锁定的单元格，以及列和行的自定义尺寸与可见性。 ~~~jsx // saving state of the spreadsheet1 @@ -328,6 +332,8 @@ spreadsheet.export.xlsx(); **相关示例**：[Spreadsheet. 导出 Xlsx](https://snippet.dhtmlx.com/btyo3j8s?tag=spreadsheet) +除单元格值外，导出的文件还会保留应用于单元格的样式、数字格式、合并单元格、固定的列和行、添加到单元格中的链接、下拉编辑器（作为 Excel 数据验证）以及[单元格的锁定状态](#setting-the-locked-state-for-a-cell)。将该文件[重新导入 Spreadsheet](#loading-excel-file-xlsx) 时，这些内容都会被恢复。 + :::note 请注意，该组件仅支持导出为 `.xlsx` 扩展名的 Excel 文件。 ::: diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/working_with_cells.md b/i18n/zh/docusaurus-plugin-content-docs/current/working_with_cells.md index 32aee958..a9a91940 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/working_with_cells.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/working_with_cells.md @@ -208,6 +208,15 @@ var cellsLocked = spreadsheet.isLocked("A1,B5,B7,D4:D6"); 该方法根据单元格的状态返回 `true` 或 `false`。如果同时检查多个单元格，只要其中至少有一个锁定单元格，方法即返回 `true`。 +### 保存锁定状态 {#saving-the-locked-state} + +单元格的锁定状态是电子表格数据的一部分，因此在保存和恢复时都会保留： + +- [](api/spreadsheet_serialize_method.md) 方法会将 `locked` 属性包含在序列化后的单元格对象中，即使被锁定的单元格没有值 +- [导出为 Excel 文件](loading_data.md#export-into-excel)会保留锁定状态，[导入该文件](loading_data.md#loading-excel-file-xlsx)会将其恢复 + +您也可以通过单元格的 `locked` 属性直接在数据集中设置锁定状态。[查看详情](loading_data.md#setting-the-locked-state-for-a-cell)。 + ## 合并单元格 {#merging-cells} ### 合并单元格 {#merge-cells}