Ajax-Webentwicklung mit Grails

Grails und Ajax

Sven Haiges

Die Ajax-Webentwicklung kann der Horror sein – muss sie aber nicht. Das Grails Web-Framework eignet sich hervorragend für die Entwicklung solcher Websites: Spezielle Ajax-Tags erleichtern den Einstieg, und Features wie die render()-Methode oder der JSON Builder sind bald unentbehrliche Helfer.

Prinzipiell kann man Ajax-Webanwendungen natürlich mit jedem beliebigen Web-Framework entwickeln. Die in Grails zur Verfügung stehenden Ajax-Tags, mit denen Sie beispielsweise einen Ajax-Aufruf initiieren können, sind eigentlich nur ein Tropfen auf dem heißen Stein. Zwar lassen sich mit diesen Tags (die übrigens auch in anderen Frameworks wie Ruby on Rails etc. ähnlich zur Verfügung stehen) manch nette Features schnell realisieren, wer jedoch über die Standard-Features hinausgehen will, muss schnell selbst Hand anlegen. Dies bedeutet, dass man HTML, CSS und JavaScript beherrschen muss. Um nicht zwischen den Browser-Inkompatibilitäten unterzugehen, bietet sich darüber hinaus die Benutzung von JavaScript Toolkits/Libraries an, beispielsweise Yahoo! Ui, Prototype oder Dojo. Wie einfach Sie mit diesen Technologien umgehen können, hängt maßgeblich von der Wahl des Frameworks ab.

Grails geht hier einen sehr direkten und unkomplizierten Weg und vereinfacht damit die Ajax-Entwicklung. Der direkte und einfache Zugriff auf alle Request-Parameter sowie auf die Response ist ein gutes Beispiel. Über die render()-Methode kann ganz unkompliziert Text zurück an die aufrufende Website gegeben werden. Sollte der Web-Client die Daten in einem anderen Format erwarten, stehen Klassen wie der JSON Builder oder das Grails Converter Plug-in zur Verfügung. Und natürlich hilft es ungemein, dass ein veränderter Controller bzw. eine veränderte GS-Page automatisch neu geladen wird. Einfach die Website neu laden, ein Server-Neustart ist nicht notwendig.

Von Grails Tags unterstützte Ajax Tookits

Prototype/Scriptaculous:
Die Prototype-Bibliothek wird meist zusammen mit script.aculo.us (Effekte) benutzt und ist die Standardbibliothek von Ruby on Rails. Prototype ist recht klein und schnell zu erlernen. Die Dokumentation ist dank der großen User Community recht gut.

Yahoo! UI hat eine sehr gute Dokumentation (API-Spickzettel, Videos, Beispiele), zudem ist das Toolkit einfach zu benutzen und zu erlernen. Im Gegensatz zu Prototype hat Yahoo! UI eine größere Anzahl Widgets (Slider, DataTable, AutoComplete, Buttons etc.).

Dojo benötigt etwas Einarbeitung, um mit den Konzepten wie dem Package-System klarzukommen, spielt seine Stärke jedoch dann aus, wenn reichlich Widgets benötigt werden. Hier findet sich vom Tree, Accordion Container, FishEye etc. alles, was man für anspruchsvolle UIs benötigt. Die Dokumentation wurde die letzten Monate deutlich verbessert.

Grails Ajax-Tags

Während die Grails Ajax-Tags den Ruby-on-Rails-Helper-Methoden recht ähnlich sind, unterscheiden sie sich doch in einem Punkt fundamental: Die Grails Ajax-Tags abstrahieren die verwendete JavaScript Library. Konkret bedeutet dies, dass Sie zwischen Prototype, Yahoo! UI und Dojo wählen können (siehe Kasten: Von Grails unterstützte Ajax Toolkits). Es sei angemerkt, dass natürlich alle drei Ajax unterstützen und auch die Browser-Inkompatibilitäten ausmerzen. Der Unterschied liegt in der Qualität der Dokumentation der APIs, der Downloadgröße sowie dem Umfang der Widget-Sammlung (vorgefertigte UI-Komponenten). Die Entscheidung, welche Library die Ajax-Tags einer GSP-Seite benutzen sollen, hängt von der Einbindung der entsprechenden Bibliothek im Head einer HTML-Seite ab. Alle folgenden Beispiele benutzen das Dojo Toolkit, elches in Grails mit <g:javascript library=“dojo“ /> geladen wird.

Bitte beachten Sie, dass Dojo zunächst heruntergeladen werden muss. Grails bietet Ihnen hierfür das Kommando > grails install-dojo an, welches Sie innerhalb eines Grails-Projekts (also im Root des Grails-Projekts) ausführen können. Derzeit lädt Grails damit die Version 0.4.3 von Dojo herunter und entpackt dojo im web-app/js/dojo-Verzeichnis. Wenn Sie einen anderen Build von Dojo benutzen wollen, können Sie dies gerne tun. Sie müssen die Dateien nur selbst im web-app/js/dojo-Verzeichnis entpacken.

Grails bietet Ihnen fünf Ajax-Tags an, deren Funktionen in Tabelle beschrieben werden. Weitere Beispiele zum Thema Grails & Ajax finden Sie im Grails Online User Guide oder im Quelltext der Ajaxy-Beispielapplikation.

Tabelle 1: Grails Ajax-Tags im Überblick
remoteField Erzeugt ein HTML-Input-Feld vom Typ Text, welches seinen Inhalt bei Veränderung per Ajax an den Server sendet. Der Name des Request-Parameters kann durch das Attribut paramName verändert werden. Falsch eingesetzt, kann dieser Tag zu einer hohen Belastung des Servers führen.
remoteFunction Erzeugt eine JavaScript-Funktion (JavaScript Function Object), welche beispielsweise von DOM Events aus gestartet werden kann. Bei Ausführung wird ein Ajax Call abgesetzt, dessen Request-Parameter frei bestimmbar sind.
remoteLink Ähnlich wie remoteFunction, nur wird hier ein HTML-A-Tag erzeugt, der bei Klick einen Ajax Call absetzt.
formRemote Erzeugt einen HTML-Form-Tag, der sämtlichen Inhalt des Formulars beim Klick auf den Submit-Button per Ajax an den Server schickt.
submitToRemote Ähnlich wie formRemote, nur wird hier das Versenden der Form auf dem Submit-Button registriert; dieser Tag versendet das ihn umgebende Formular per Ajax Call.
Geschrieben von
Sven Haiges
Kommentare

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.