Initialisierung
Diese Anleitung beschreibt, wie Sie DHTMLX Spreadsheet auf einer Seite erstellen und Ihrer Anwendung ein voll funktionsfähiges Arbeitsblatt hinzufügen. Führen Sie die folgenden Schritte aus, um die Komponente einsatzbereit zu machen:
- Binden Sie die DHTMLX Spreadsheet-Quelldateien auf einer Seite ein.
- Erstellen Sie einen Container für DHTMLX Spreadsheet.
- Initialisieren Sie DHTMLX Spreadsheet mit dem Objekt-Konstruktor.
Quelldateien einbinden
Laden Sie das Paket herunter und entpacken Sie es in einen Ordner Ihres Projekts.
Um DHTMLX Spreadsheet zu erstellen, müssen Sie 2 Quelldateien auf Ihrer Seite einbinden:
- spreadsheet.js
- spreadsheet.css
Stellen Sie sicher, dass Sie korrekte relative Pfade zu diesen Dateien setzen:
<script type="text/javascript" src="codebase/spreadsheet.js"></script>
<link rel="stylesheet" href="codebase/spreadsheet.css">
Die Struktur des Spreadsheet-Pakets ist wie folgt:
- sources - die Quellcode-Dateien der Bibliothek; sie sind leicht lesbar und hauptsächlich für das Debugging gedacht;
- codebase - die obfuskierten Code-Dateien der Bibliothek; sie sind deutlich kleiner und für den Einsatz in der Produktion vorgesehen. Binden Sie diese Dateien in Ihre Apps ein, wenn diese fertig sind;
- samples - die Code-Beispiele;
- docs - die vollständige Dokumentation der Komponente.
Container erstellen
Fügen Sie einen Container für Spreadsheet hinzu und geben Sie ihm eine ID, zum Beispiel "spreadsheet":
<div id="spreadsheet"></div>
DHTMLX Spreadsheet initialisieren
Initialisieren Sie DHTMLX Spreadsheet mit dem dhx.Spreadsheet-Objekt-Konstruktor. Der Konstruktor hat zwei Parameter:
- den HTML-Container für Spreadsheet,
- ein Objekt mit Konfigurationseigenschaften. Siehe die vollständige Liste unten.
// DHTMLX Spreadsheet erstellen
const spreadsheet = new dhx.Spreadsheet("spreadsheet", {
// Konfigurationsoptionen
});
Konfigurationseigenschaften
Siehe die vollständige Liste der Eigenschaften, die Sie im Spreadsheet-Konfigurationsobjekt angeben können.
Sie können Konfigurationsoptionen bei der Initialisierung als zweiten Parameter des Konstruktors festlegen: