Microsofts Ajax-Framework AtlasMicrosoft goes Ajax

Integration in ASP.NET 2.0

Microsofts Ajax-Framework Atlas

Atlas tritt mit dem Ziel an, alle möglichen Vereinfachungen für Ajax-Anwendungen zu schaffen. Im Mittelpunkt steht dabei die nahtlose Integration in ASP.NET 2.0 und in die Editoren Visual Studio und Visual Web Developer. Zwar können Sie Atlas-Code auch ohne eine der Entwicklungsumgebungen schreiben, aber da der Web Developer kostenfrei verfügbar ist, gibt es dafür in der Praxis eigentlich keinen Grund.

Im Mittelpunkt von Atlas stehen die vorgefertigten Komponenten, die dem Entwickler viel Handarbeit ersparen sollen. Daneben gibt es noch eine eigene Javascript-Bibliothek und die Integration von Webservices. Hier ein kurzer Überblick über das, was Atlas bietet:

– Client-seitige Controls
– Erweiterung für Web-Controls
– Unterstützung von Webservices
– Animationshilfen
– Datenbindung
– Javascript-Bibliothek für den Client

Installation

Microsofts Ajax-Framework Atlas

Atlas ist als Teil der offiziellen ASP.NET-Website unter atlas.asp.net erhältlich. Dort wird in regelmäßigen Abständen ein Community Build zum Ausprobieren zur Verfügung gestellt. Außerdem finden Sie Dokumentationen, Videos und Atlas-Blogs. Die aktuelle Version stammt von Ende Juli dieses Jahres und besitzt bereits eine Go-Live-Lizenz. Sie ist allerdings bis zum 1. September 2007 oder bis zum Erscheinen einer kommerziellen Software auf Atlas-Basis beschränkt. Gerade Letzteres sollte im Moment allerdings nicht stören, denn noch ist völlig offen, wie es mit Atlas weitergeht.

Atlas tritt neuerdings als MSI-Datei an. In den vorherigen Versionen war es noch eine VSI, also eine reine Visual-Studio/Visual-Web-Developer-Komponente. Dass eine freie Installation ohne Visual-Studio-Template möglich ist, sollte allerdings nicht darüber hinwegtäuschen, dass Atlas im Moment eigentlich nur mit einem der beiden Microsoft-Editoren Spaß beim Entwickeln macht. Ansonsten müssten Sie nämlich den Projektaufbau und natürlich auch den Code komplett von Hand entwickeln. Da Atlas als Komponente auf Visual Studio oder Visual Web Developer aufsetzt, gibt es zwischen den beiden Editoren keine Funktionsunterschiede. Insofern reicht es problemlos aus, wenn Sie den kostenlosen Visual Web Developer als Basis verwenden.

Nachdem Sie die Installation gestartet haben, stimmen Sie der Lizenz zu und wählen als erste wichtige Entscheidung das Atlas Visual Studio Project Template aus. Sollte Visual Studio oder Visual Web Developer noch nicht installiert sein, sollten Sie das vor der Atlas-Installation nachholen. Die nächste Entscheidung betrifft ASBX, eine Dateiendung für den Zugriff auf die Webservice-Bridge. Sie soll beim IIS, Microsofts Webserver, registriert werden. Sollten Sie nur mit dem in Visual Studio und Visual Web Developer integrierten Webserver arbeiten, müssen Sie das Kontrollkästchen auch deaktivieren.

Die Installation geht nun ausgesprochen schnell, da Atlas nur aus wenigen Javascript-Bibliotheken, Assemblys und Vorlagen besteht. Für die Visual-Studio-Vorlagen erhalten Sie noch eine Nachfrage, bei der Sie die VB- und C#-Version installieren können. Im Hintergrund läuft hier der alte VSI-Installer.

Anschließend gibt es unter Start, Programme den Eintrag Microsoft ASP.NET Atlas mit den Unterverzeichnissen Atlas und Windows Communication Foundation. Beide enthalten die jeweilige Assembly mit der Funktionalität und einige Skriptbibliotheken.

Die erste Atlas-Website

Microsofts Ajax-Framework Atlas

In Visual Studio oder Visual Web Developer hat sich Atlas als neues Template eingenistet. Generieren Sie eine neue Website. Dort finden Sie dann eine Atlas-Website. Zusätzlich gibt es auf der Atlas-Projektsite noch ein Beispielprojekt namens Atlas-Wiki, das auch als Vorlage verfügbar ist. Es ist ein von Microsoft im Stil der Starter-Kits mitgeliefertes Wiki auf ASP.NET- und Atlas-Basis. Dabei handelt es sich um eine umfangreiche Anwendung, die die Grundfunktionen von Atlas enthält. In diesem Workshop soll allerdings eine leere Atlas-Website der Ausgangspunkt sein.

Wenn Sie die Website erstellt haben, sehen Sie im Projekt-Explorer ein paar neue Dateien und Verzeichnisse, die die Atlas-Website von anderen Websites unterscheiden. App_Data ist für die internen ASP.NET-Datenbanken gedacht, aber anfangs noch leer. Das Bin-Verzeichnis enthält die Atlas-Assembly (Microsoft.Web.Atlas.dll). Sie ist in der speziell für die Atlas-Website angelegten Konfigurationsdatei web.config verankert:

Dort finden Sie auch weitere Atlas-Einstellungen, beispielsweise für Webservices, Erweiterungen und HTTP-Handler.

Sie können nun die Standardseite Default.aspx öffnen oder eine neue Seite anlegen, um die erste Atlas-Webseite zu erstellen. In der Standardseite finden Sie bereits das erste Atlas-Control, den Script-Manager. Er bindet die Atlas-Bibliotheken in Ihre Webseite ein:

Neben dem Script-Manager gibt es einen zweiten Bereich in der Standardseite, der bereits auf die Anwesenheit von Atlas hindeutet, eine Sektion mit XML-Script. Diese Neuerfindung von Microsoft dient dazu, den Client-seitigen Bibliotheken von Atlas ebenso Client-seitige Informationen zur Verfügung zu stellen.

Ausgabebeispiel

Microsofts Ajax-Framework Atlas

Update-Panel

Microsofts Ajax-Framework Atlas

Im nächsten Schritt kommt ein Atlas-Control zum Einsatz, das Update-Panel. Dieses Control zeigt sehr gut, was serverseitige Frameworks für die Ajax-Entwicklung leisten können. Es kapselt darin enthaltene Web-Controls und schickt deren Post-Anfragen direkt an den Webserver. Dafür muss zuerst einmal ein Script-Manager vorhanden sein. Außerdem muss im Script-Manager das partielle Rendern der Seite möglich sein. Aktiviert wird dies mit dem Attribut EnablePartialRendering:


<atlas:ScriptManager
ID="ScriptManager1"
EnablePartialRendering="true" runat="server" />


Partielles Rendern bedeutet, dass Teile der ASP.NET-Seite neu geladen werden können, ohne dass der Rest davon betroffen ist. Sie können in einer Webseite mehrere Update-Panels einfügen. Jedes kapselt die darin enthaltenen Controls. Außerdem ist es möglich, Update-Panels in Masterseiten oder User-Controls einzusetzen. Grundlegend wird ein Update-Panel als Atlas-Control angelegt:

Das Update-Panel enthält dann ein Content-Template. Dort fügen Sie die Web-Controls ein. Als Beispiel soll hier ein Gridview-Control dienen, das Daten aus einer – hier sehr einfachen – Datenbank darstellt. Das Gridview wird erzeugt, indem Sie die Datenbanktabelle in der Entwurfsansicht von Visual Studio oder Visual Web Developer auf die Seite ziehen. Der Editor generiert dazu automatisch ein SqlDataSource-Control zur Anbindung der Datenbank. Um das Update-Panel zu testen, benötigen Sie noch ein Ereignis, das einen Post-Back, also ein Neuladen der Seite auslöst. Dafür aktivieren Sie über die Aufgaben das Sortieren (Befehl Sortieren aktivieren). Ohne Update-Panel würde jeder Sortiervorgang zum Neuladen der gesamten Seite führen. Sie können das einfach testen, indem Sie außerhalb des Update-Panels ein weiteres Gridview oder ein anderes Control einfügen.

Gridview-Control

Microsofts Ajax-Framework Atlas

Hier der Code mit einem Gridview. Attribute und Templates für die Formatierung des Gridviews fehlen aus Platzgründen:

Das Update-Panel funktioniert auch mit anderen Web-Controls, beispielsweise mit dem Calendar-Control, das beim Tag- oder Monatswechsel die Seite neu lädt. Sie fügen dazu einfach nur das jeweilige Control im Content-Template-Bereich des Update-Panels ein. Einzig Datei-Uploads funktionieren im Update-Panel nicht. Sie müssen außerhalb platziert werden.

Was den normalen ASP.NET-Lebenszyklus vom Seitenzusammenbau über die Control-Darstellung bis zur Ausgabe angeht, sorgt das Update-Panel für denselben Lebenszyklus wie ein normaler Post-Back. Allerdings werden nur die Controls zurückgeliefert, die sich im Update-Panel befinden.

Update-Panel aktualisieren

Microsofts Ajax-Framework Atlas

Neben dem Content-Template-Bereich erlaubt das Update-Panel auch noch einen Triggers-Bereich. Mit Triggern wird festgelegt, wann ein Update-Panel aktualisiert wird. Normalerweise erfolgt das bei allen Post-Back-Aktionen von Web-Controls. Dies entspricht dem Standardattribut Mode=”Always”. Wenn Mode dagegen den Wert Conditional hat, werden nur die als Trigger angegebenen Ereignisse zur Aktualisierung genutzt. Hier ein Beispiel für eine Schaltfläche:

Für ein Gridview legen Sie beispielsweise als Ereignis das Sortieren fest:

Neben dem ControlEventTrigger gibt es noch den ControlValueTrigger. Er springt nicht auf ein Ereignis, sondern auf das Ändern eines Wertes an.

Fazit

Microsofts Ajax-Framework Atlas

Client-seitige Label und das Update-Panel sind natürlich nur ein kleiner Ausschnitt aus den Atlas-Fähigkeiten. Drag and Drop, Datenbindung und Webservices blieben aus Platzgründen noch außen vor. Zudem darf man gespannt sein, was sich Microsoft für die finale Version von Atlas noch einfallen lassen wird. Auch das Atlas Control Toolkit mit neuen Atlas-Controls sieht bereits sehr vielversprechend aus. Bei aller berechtigten Begeisterung sollen aber auch die Nachteile von Atlas nicht unerwähnt bleiben: Zum einen lassen sich zwar Teile des Atlas-Frameworks, vor allem die Javascript-Bibliotheken, auch ohne ASP.NET verwenden, für anderes ist ASP.NET aber unbedingt erforderlich, und gerade bei der Kapselung von Javascript-Programmierung ist der Microsoft-Stil immer erkennbar. Zum anderen hilft ein Ajax-Framework zwar sehr bei der Entwicklung, jeder Sonderfall führt aber wieder zu Javascript-Handarbeit und damit zu einer komplexen Anwendung.

Alle Listings zum Workshop finden Sie auf der Heft-CD und unter listings.internet-pro.de