dojo Toolkit
Das dojo Toolkit ist eine umfassende JavaScript Bibliothek. Hauptzweck der Bibliothek ist es, die Entwicklung des clientseitigen Teils einer AJAX Applikation zu vereinfachen.
Besonderes Augenmerk wird dabei auf die Aspekte asynchrone Kommunikation, Widgets und ein Event-Framework gelegt.
Asynchrone Kommunikation
Eine wichtige Funktion der Bibliothek ist dojo.xhrPost. Mit dieser Funktion können Daten an eine Webapplikation gesendet werden, ohne dass im Browser ein Seitenwechsel erfolgt.
Mit dojo.xhrPost ist es sehr einfach, die Werte aus einem Formular an den Server zu senden:
dojo.xhrPost({
form: dojo.byId("... Name des Formular-Nodes ..."),
url: "... URL, an die die Daten gesendet werden ...",
preventCache: true,
handleAs: "javascript",
encoding: "UTF-8"})
Die Rückgabe des Servers muss JavaScript sein, wenn bei handleAs "javascript" angegeben wird. Dieses JavaScript wird ausgeführt, sobald es beim Browser eintrifft.
Normalerweise wird man bei diesem Vorgehen JavaScript an den Browser schicken, das den Inhalt der gerade angezeigten Seite modifiziert.
Auch für diese Modifikation kann auf die Methoden des dojo Toolkits zurückgegriffen werden. Man markiert ein div-Tag mit dem Attribut dojoType="dijit.layout.ContentPane". Dann kann mit
dijit.byId("... Id des Nodes ...").setContent("... neuer Inhalt ...");
der Inhalt des divs gesetzt werden. Wahlweise kann man das JavaScript, das von der setContent-Methode ausgeführt wird, auch direkt an den Browser schicken. Wie dieser JavaScript-Code aussieht, kann man in der Dokumentation der Funktion replace-node nachlesen. Diese Funktion ist Teil des Frameworks, mit dem die simplysomthings.de Wiki-Farm betrieben wird.
Widgets
Weitere Features des Toolkits sind die sogenannten Widgets. Dabei handelt es sich um User Interface Elemente, von denen einige ohne zusätzliche Bibliotheken nicht von einem Browser unterstützt werden, z.B.:
dijit.form.ComboBox,
dijit.form.CheckBox,
dijit.form.Spinner,
dijit.form.Slider,
dijit.Editor, ein Texteingabefeld für Rich Text,
dijit.Tree, für Baumdarstellungen,
dijit.Menu, Menüs,
dijit.ColorPalette, zur Auswahl von Farben,
dijit.Tooltip,
dijit.ProgressBar, ein Fortschrittsbalken,
dijit.TitlePane, eine auf- und zuklappbare Darstellung,
dijit.layout.SplitContainer, für eine in zwei Teile getrennte Darstellung,
dijit.layout.AccordionContainer, zeigt einen von mehreren Panels,
dijit.layout.TabContainer, zeigt einen von mehreren Tabs.
Event-Framework
Die Entwicklung von browser-seitiger Präsentationslogik wird durch ein Event-Framework unterstützt. Mit diesem lassen sich Event-Quellen (z.B. Widgets) mit Event-Listenern verknüpfen.
Beispiele
Eine Beispielapplikation, die das dojo Toolkit verwendet, ist das Wiki, in dem dieses Dokument abgelegt ist.
Quellen
http://dojotoolkit.org/
http://manual.dojotoolkit.org/WikiHome/DojoDotBook/Book10
Besonderes Augenmerk wird dabei auf die Aspekte asynchrone Kommunikation, Widgets und ein Event-Framework gelegt.
Asynchrone Kommunikation
Eine wichtige Funktion der Bibliothek ist dojo.xhrPost. Mit dieser Funktion können Daten an eine Webapplikation gesendet werden, ohne dass im Browser ein Seitenwechsel erfolgt.
Mit dojo.xhrPost ist es sehr einfach, die Werte aus einem Formular an den Server zu senden:
dojo.xhrPost({
form: dojo.byId("... Name des Formular-Nodes ..."),
url: "... URL, an die die Daten gesendet werden ...",
preventCache: true,
handleAs: "javascript",
encoding: "UTF-8"})
Die Rückgabe des Servers muss JavaScript sein, wenn bei handleAs "javascript" angegeben wird. Dieses JavaScript wird ausgeführt, sobald es beim Browser eintrifft.
Normalerweise wird man bei diesem Vorgehen JavaScript an den Browser schicken, das den Inhalt der gerade angezeigten Seite modifiziert.
Auch für diese Modifikation kann auf die Methoden des dojo Toolkits zurückgegriffen werden. Man markiert ein div-Tag mit dem Attribut dojoType="dijit.layout.ContentPane". Dann kann mit
dijit.byId("... Id des Nodes ...").setContent("... neuer Inhalt ...");
der Inhalt des divs gesetzt werden. Wahlweise kann man das JavaScript, das von der setContent-Methode ausgeführt wird, auch direkt an den Browser schicken. Wie dieser JavaScript-Code aussieht, kann man in der Dokumentation der Funktion replace-node nachlesen. Diese Funktion ist Teil des Frameworks, mit dem die simplysomthings.de Wiki-Farm betrieben wird.
Widgets
Weitere Features des Toolkits sind die sogenannten Widgets. Dabei handelt es sich um User Interface Elemente, von denen einige ohne zusätzliche Bibliotheken nicht von einem Browser unterstützt werden, z.B.:
dijit.form.ComboBox,
dijit.form.CheckBox,
dijit.form.Spinner,
dijit.form.Slider,
dijit.Editor, ein Texteingabefeld für Rich Text,
dijit.Tree, für Baumdarstellungen,
dijit.Menu, Menüs,
dijit.ColorPalette, zur Auswahl von Farben,
dijit.Tooltip,
dijit.ProgressBar, ein Fortschrittsbalken,
dijit.TitlePane, eine auf- und zuklappbare Darstellung,
dijit.layout.SplitContainer, für eine in zwei Teile getrennte Darstellung,
dijit.layout.AccordionContainer, zeigt einen von mehreren Panels,
dijit.layout.TabContainer, zeigt einen von mehreren Tabs.
Event-Framework
Die Entwicklung von browser-seitiger Präsentationslogik wird durch ein Event-Framework unterstützt. Mit diesem lassen sich Event-Quellen (z.B. Widgets) mit Event-Listenern verknüpfen.
Beispiele
Eine Beispielapplikation, die das dojo Toolkit verwendet, ist das Wiki, in dem dieses Dokument abgelegt ist.
Quellen
http://dojotoolkit.org/
http://manual.dojotoolkit.org/WikiHome/DojoDotBook/Book10