Migration zu neueren Versionen

5.2 -> 6.0

Veraltete Eigenschaften

Die folgenden Eigenschaften von ISpreadsheetConfig sind veraltet und wurden entfernt. Lesen Sie die aktuelle Verwendung unten:

dateFormat Konfigurationseigenschaft. Legen Sie diese im Konfigurationsobjekt localization fest als:
- { localization: { dateFormat: "%d/%m/%Y" } }
timeFormat Konfigurationseigenschaft. Legen Sie diese im Konfigurationsobjekt localization fest als:
- { localization: { timeFormat: 12 } }

Veraltete Methoden

Die folgenden Methoden der ISpreadsheet-Instanz sind veraltet und wurden entfernt.

Verwenden Sie stattdessen das neue sheets-Modul (Sheet Manager) API:

Veraltete Methode	Signatur	Neue Verwendung	Neue Signatur
`clearSheet(id?)`	`(id?: string) => void`	`sheets.clear(id?)`	`(id?: Id) => void`
`removeSheet(id)`	`(id: string) => void`	`sheets.remove(id)`	`(id: Id) => void`
`addSheet(name?)`	`(name?: string) => string`	`sheets.add(name?)`	`(name?: string) => Id`
`getSheets()`	`() => ISheet[]`	`sheets.getAll()`	`() => ISheet[]`
`getActiveSheet()`	`() => ISheet`	`sheets.getActive()`	`() => ISheet`
`setActiveSheet(id)`	`(id: Id) => void`	`sheets.setActive(id)`	`(id: Id) => void`

Veraltete Events

Die folgenden Events sind veraltet und wurden entfernt. Verwenden Sie stattdessen das generische Event-Paar beforeAction / afterAction.

Veraltetes Event	Callback-Signatur	Neue Verwendung
`beforeValueChange`	`(cell: string, value: string) => void \| boolean`	`beforeAction` mit Action `"setCellValue"`
`afterValueChange`	`(cell: string, value: string) => void`	`afterAction` mit Action `"setCellValue"`
`beforeStyleChange`	`(cell: string, style: ...) => void \| boolean`	`beforeAction` mit Action `"setCellStyle"`
`afterStyleChange`	`(cell: string, style: ...) => void`	`afterAction` mit Action `"setCellStyle"`
`beforeFormatChange`	`(cell: string, format: string) => void \| boolean`	`beforeAction` mit Action `"setCellFormat"`
`afterFormatChange`	`(cell: string, format: string) => void`	`afterAction` mit Action `"setCellFormat"`
`beforeRowAdd`	`(cell: string) => void \| boolean`	`beforeAction` mit Action `"addRow"`
`afterRowAdd`	`(cell: string) => void`	`afterAction` mit Action `"addRow"`
`beforeRowDelete`	`(cell: string) => void \| boolean`	`beforeAction` mit Action `"deleteRow"`
`afterRowDelete`	`(cell: string) => void`	`afterAction` mit Action `"deleteRow"`
`beforeColumnAdd`	`(cell: string) => void \| boolean`	`beforeAction` mit Action `"addColumn"`
`afterColumnAdd`	`(cell: string) => void`	`afterAction` mit Action `"addColumn"`
`beforeColumnDelete`	`(cell: string) => void \| boolean`	`beforeAction` mit Action `"deleteColumn"`
`afterColumnDelete`	`(cell: string) => void`	`afterAction` mit Action `"deleteColumn"`
`beforeSheetAdd`	`(name: string) => void \| boolean`	`beforeAction` mit Action `"addSheet"`
`afterSheetAdd`	`(sheet: ISheet) => void`	`afterAction` mit Action `"addSheet"`
`beforeSheetRemove`	`(sheet: ISheet) => void \| boolean`	`beforeAction` mit Action `"deleteSheet"`
`afterSheetRemove`	`(sheet: ISheet) => void`	`afterAction` mit Action `"deleteSheet"`
`beforeSheetRename`	`(sheet: ISheet, value: string) => void \| boolean`	`beforeAction` mit Action `"renameSheet"`
`afterSheetRename`	`(sheet: ISheet) => void`	`afterAction` mit Action `"renameSheet"`
`beforeSheetClear`	`(sheet: ISheet) => void \| boolean`	`beforeAction` mit Action `"clearSheet"`
`afterSheetClear`	`() => void`	`afterAction` mit Action `"clearSheet"`

5.1 -> 5.2

Einfrieren/Auftauen von Spalten und Zeilen

In v5.2 wurde die Art und Weise, wie Spalten und Zeilen eingefroren/aufgetaut werden, geandert:

die Konfigurationseigenschaften leftSplit und topSplit, die zum Fixieren von Spalten und Zeilen verwendet wurden, sind veraltet und wurden entfernt

Vor v5.2
const spreadsheet = new dhx.Spreadsheet("spreadsheet_container", {
    topSplit: 1, // die Anzahl der einzufrierende Zeilen
    leftSplit: 1 // die Anzahl der einzufrierende Spalten
});

neue API-Methoden wurden eingefuhrt: freezeCols(), unfreezeCols(), freezeRows(), unfreezeRows()

Ab v5.2
// fur Zeilen
spreadsheet.freezeRows("B2"); // die Zeilen bis zur zweiten Zeile werden fixiert
spreadsheet.freezeRows("sheet2!B2"); // die Zeilen bis zur zweiten Zeile in "sheet2" werden fixiert
spreadsheet.unfreezeRows(); // fixierte Zeilen im aktuellen Sheet werden aufgetaut
spreadsheet.unfreezeRows("sheet2!A1"); // fixierte Zeilen in "sheet2" werden aufgetaut

// fur Spalten
spreadsheet.freezeCols("B2"); // die Spalten bis zur Spalte "B" werden fixiert
spreadsheet.freezeCols("sheet2!B2"); // die Spalten bis zur Spalte "B" in "sheet2" werden fixiert
spreadsheet.unfreezeCols(); // fixierte Spalten im aktuellen Sheet werden aufgetaut
spreadsheet.unfreezeCols("sheet2!A1"); // fixierte Spalten in "sheet2" werden aufgetaut

neue Action wurde hinzugefugt: toggleFreeze

Ab v5.2
// Verwendung der `toggleFreeze`-Action mit den 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);
    }
});

neue freeze-Eigenschaft fur das sheets-Objekt der Methode parse() wurde hinzugefugt. Sie ermoglicht das Fixieren von Zeilen und Spalten fur bestimmte Sheets im Datensatz beim Einlesen von Daten in Spreadsheet:

Ab v5.2
const data = {
    sheets: [
        { 
            name: "sheet 1", 
            id: "sheet_1",
            data: [
                { cell: "A1", value: "Country" },
                { cell: "B1", value: "Product" }
            ],
            freeze: {
                col: 2,
                row: 2
            },
            // weitere "sheet_1"-Einstellungen
        }, 
        // weitere Sheet-Konfigurationsobjekte
    ]
};

spreadsheet.parse(data);

4.3 -> 5.0

In v5.0 wurde die Option "help" der Eigenschaft toolbarBlocks in "helpers" umbenannt. Ausserdem enthalt der Standardsatz von Optionen nun die neue Option "actions".

Vor v5.0
// Standardkonfiguration 
toolbarBlocks: [
    "undo", 
    "colors", 
    "decoration", 
    "align", 
    "format", 
    "help"
]

Ab v5.0
// Standardkonfiguration
toolbarBlocks: [
    "undo", 
    "colors", 
    "decoration", 
    "align", 
    "format", 
    "actions",
    "helpers"
]

4.2 -> 4.3

Info

Version 4.3 ist die letzte Version mit IE-Unterstutzung

Version 4.3 fuhrt einen neuen Ansatz zum Nachverfolgen und Behandeln von Actions ein, die beim Andern von Daten in der Tabelle ausgefuhrt werden.

Die neuen Events beforeAction und afterAction werden unmittelbar vor bzw. nach der Ausfuhrung einer Action ausgelost und geben an, welche Action ausgefuhrt wurde. Dieser Ansatz ermoglicht es Ihnen, mit nur diesen zwei Events die notige Logik fur mehrere Actions gleichzeitig hinzuzufugen. Zum Beispiel:

spreadsheet.events.on("BeforeAction", (actionName, config) => {
    if (actionName === "sortCells") {
        console.log(actionName, config);
        return true;
    }
    if (actionName === "addColumn") {
        console.log(actionName, config);
        return false;
    },
    ...
});

spreadsheet.events.on("AfterAction", (actionName, config) => {
    if (actionName === "sortCells") {
        console.log(actionName, config)
    }
    if (actionName === "addColumn") {
        console.log(actionName, config);
    },
    ...
});

Dieser Ansatz reduziert den Umfang Ihres Codes, da Sie nicht mehr fur jede einzelne Action Sets von gepaarten before- und after- Events hinzufugen mussen.

Der alte Ansatz funktioniert nach wie vor wie zuvor. Weitere Details finden Sie unter Spreadsheet-Actions.

Info

Derzeit gibt es eine Reihe von Events, die auf die alte Weise verwendet werden mussen, da sie nicht durch Actions ersetzt werden konnen: beforeEditEnd, afterEditEnd, beforeEditStart, afterEditStart, beforeFocusSet, afterFocusSet, beforeSheetChange, afterSheetChange, groupFill.

4.1 -> 4.2

In v4.2 wurde der Ausrichten-Block der Spreadsheet-Toolbar in zwei Unterblocks aufgeteilt: Horizontales Ausrichten und Vertikales Ausrichten. Dadurch wurde die Liste der IDs der Standard-Controls des Ausrichten-Blocks geandert und erweitert:

Vor v4.2:

Der Ausrichten-Block:

die Schaltflache Linksbundig (id: "align-left")
die Schaltflache Zentrieren (id: "align-center")
die Schaltflache Rechtsbundig (id: "align-right")

Ab v4.2:

Der Unterblock Horizontales Ausrichten des Ausrichten-Blocks:

die Schaltflache Links (id: "halign-left")
die Schaltflache Mitte (id: "halign-center")
die Schaltflache Rechts (id: "halign-right")

Der Unterblock Vertikales Ausrichten des Ausrichten-Blocks:

die Schaltflache Oben (id: "valign-top")
die Schaltflache Mitte (id: "valign-center")
die Schaltflache Unten (id: "valign-bottom")

Lokalisierung

Beachten Sie, dass die Lokalisierungsoptionen fur den Ausrichten-Block ebenfalls aktualisiert wurden:

Vor v4.2:

const locale = {
    align: "Align",
    ...
}

Ab v4.2:

const locale = {
    halign: "Horizontal align",
    valign: "Vertical align",
    ...
}

2.1 -> 3.0

Diese Liste von Anderungen hilft Ihnen bei der Migration von Version 2.1, in der DHTMLX Spreadsheet PHP-basiert war, zur vollstandig neu entwickelten Version 3.0, die vollstandig in JavaScript aufgebaut ist. Lesen Sie die folgende Liste, um alle Anderungen zu erfahren.

Info

Die API von Version 2.1 ist weiterhin verfugbar, ist jedoch nicht kompatibel mit der API ab Version 3.0. Falls Sie die Dokumentation fur Version 2.1 benotigen, kontaktieren Sie uns bitte, und wir senden sie Ihnen zu.

Geanderte API

getStyle -> spreadsheet.getStyle - gibt die auf eine oder mehrere Zellen angewendeten Styles zuruck
getValue -> spreadsheet.getValue - gibt ein Objekt mit dem Wert oder den Werten einer oder mehrerer Zellen zuruck
setStyle -> spreadsheet.setStyle - legt den Style fur eine Zelle oder einen Zellbereich fest
setValue -> spreadsheet.setValue - legt den Wert fur eine Zelle oder einen Zellbereich fest
lock -> spreadsheet.lock - sperrt eine Zelle oder einen Zellbereich
unlock -> spreadsheet.unlock - entsperrt eine gesperrte Zelle oder einen gesperrten Zellbereich

Entfernte API

Spreadsheet-Klasse

getCell
getCells
isCell
setSheetId

SpreadsheetCell

calculate	getCoords	setBgColor
exists	getValidator	setBold
getAlign	isBold	setColor
getBgColor	isIncorrect	setItalic
getCalculatedValue	isItalic	setLocked
getColIndex	parseStyle	setValidator
getColName	serializeStyle
getColor	setAlign

5.2 -> 6.0​

Veraltete Eigenschaften​

Veraltete Methoden​

Veraltete Events​

5.1 -> 5.2​

Einfrieren/Auftauen von Spalten und Zeilen​

4.3 -> 5.0​

4.2 -> 4.3​

4.1 -> 4.2​

Lokalisierung​

2.1 -> 3.0​

Geanderte API​

Entfernte API​

Spreadsheet-Klasse​

SpreadsheetCell​

5.2 -> 6.0

Veraltete Eigenschaften

Veraltete Methoden

Veraltete Events

5.1 -> 5.2

Einfrieren/Auftauen von Spalten und Zeilen

4.3 -> 5.0

4.2 -> 4.3

4.1 -> 4.2

Lokalisierung

2.1 -> 3.0

Geanderte API

Entfernte API

Spreadsheet-Klasse

SpreadsheetCell