andreas-schlapsi.at » ASP.NET

Intellisense für jQuery in Visual Studio 2008

Andreas Schlapsi — Mon, 27 Oct 2008 21:32:35 +0000

Bertrand Le Roy hat heute bekanntgegeben, dass die Intellisense-Dokumentationsdateien für jQuery in Visual Studio 2008 von der jQuery-Homepage heruntergeladen werden kann. Tatsächlich gibt es einen Download-Link, der als Dokumentationsdatei für Visual Studio bezeichnet wird.

In der Datei jquery-1.2.6-vsdoc.js befindet sich der jQuery-Quellcode mit XML-Kommentaren. Sie sollten diese jQuery-Variante nur zum Entwickeln verwenden. Bertrand Le Roy schlägt vor, die Datei vorerst nur in einem Server-Codeblock (if (false)) einzubinden. Das ASP.NET AJAX-Team arbeitet an einer besseren Lösung.

Ein erster Blick auf jQuery

Andreas Schlapsi — Wed, 08 Oct 2008 21:55:34 +0000

Scott Guthrie und John Resig kündigten Ende September an, dass die nächste Version von Visual Studio die JavaScript-Library jQuery enthalten wird. Die Entwicklungsumgebung wird Intellisense für jQuery-Methoden bieten und die jQuery-Hilfe in das Hilfesystem integriert sein. Grund genug, um einen ersten Blick auf die JavaScript-Library zu werfen.

Dieser Artikel ist der Beginn einer Blogserie, mit der ich die Grundlagen von jQuery vorstellen möchte. In dieser Folge sehen wir uns ein einfaches jQuery-Script an.

Hello, world!

Um mit jQuery experimentieren und entwickeln zu können, laden Sie die JavaScript-Library von der Homepage runter. Das Beispiel wurde mit Version 1.2.6 entwickelt und getestet. Es gibt drei Varianten für den Download:

Uncompressed - enthält den originalen JavaScript-Code mit Kommentaren und Whitespace.
Packed - ist die kleinste Datei. Am Client wird aber JavaScript-Code ausgeführt, um den eigentlichen jQuery-Code zu entpacken, weshalb die Performance am schlechtesten ist.
Minified - enthält den originalen JavaScript-Code ohne Kommentare und Whitespace. Diese Variante wird für Produktionssysteme empfohlen.

Für unser erstes Beispiel kopieren Sie die heruntergeladene Datei unter dem Namen „jquery.js“ in ein beliebiges Verzeichnis, in dem Sie auch eine neue HTML-Datei mit folgendem Inhalt anlegen:


    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>
  >
    >jQuery Sample>
     src="jquery.js" type="text/javascript">>
     type="text/javascript">
      $(document).ready(function() {
        $("#Label").click(function() {
          $(this).text("Hello, world!");
        });
      });
    >
  >
  >
     id="Label" style="border: 1px solid #000;">
      This is a test.
    >
  >
>

Wenn Sie die Datei öffnen, zeigt der Browser den Text „This is a test.“ an. Wenn Sie darauf klicken, tauscht der JavaScript-Code den Text gegen „Hello, world!“ aus.

Der Startpunkt des Frameworks ist „$“, ein Alias für die Funktion jQuery, die als Argument einen Selektor oder ein DOM-Element erwartet. In unserem Beispiel verwenden wir die $-Funktion drei Mal: $(document), $("#Label") und $(this). $(document) und $(this) geben jeweils ein Objekt zurück, dessen Methoden auf die angegebenen DOM-Elemente wirken. $("#Label") verwendet einen CSS-Selektor, um das DIV-Element mit der ID „Label“ zu finden.

Das Ready-Ereignis

JavaScript-Code wird sofort nach dem Parsen ausgeführt. Zu diesem Zeitpunkt ist der Dokumentenbaum noch nicht vollständig aufgebaut, was zu Problemen führen kann.

JavaScript-Entwickler verwenden deshalb häufig das Load-Ereignis am window-Objekt für Initialisierungscode. Der Browser löst dieses Ereignis aus, sobald er die Seite geladen hat. Der Code wird aber erst ausgeführt, nachdem auch alle Bilder geladen wurden.

jQuery bietet deshalb das Ready-Ereignis an. jQuery wartet, bis das Dokument bereit ist, um bearbeitet zu werden, und löst dann das Ereignis aus.

Eventhandler

Eventhandler sind für jQuery einfache JavaScript-Funktionen. Wir haben in unserem Beispiel anonyme Funktionen verwendet (Zeilen 8 und 9).

Unser Beispiel registriert einen Eventhandler für das Click-Ereignis am DIV-Element mit der ID „Label“. Ein DOM-Element löst das Click-Ereignis aus, wenn der Benutzer darauf mit der Maus klickt.

Hinweis: In Eventhandlern zeigt this auf das DOM-Element, das das Ereignis ausgelöst hat.

Unser Beispiel verändert in Zeile 10 im Click-Eventhandler des DIV-Elements den Textinhalt des Elements mit der Methode „text“:

$(this).text("Hello, world!");

Zusammenfassung

Der Startpunkt für jQuery ist die Funktion jQuery mit dem Alias „$“. Mit Selektoren referenzieren Sie DOM-Elemente, auf die Sie mit dem jQuery-API Eventhandler registrieren, DOM-Manipulationen durchführen oder Effekte aufrufen können.

Das Ready-Ereignis können Sie zur Initialisierung Ihrer JavaScript-Anwendung nutzen. Wie bei normalen JavaScript-Eventhandlern referenziert this in einer als Eventhandler registrierten Funktion das DOM-Element, das das Ereignis ausgelöst hat.

In der nächsten Folge wenden wir uns den jQuery-Selektoren zu.

ASP.NET MVC auf Mono

Andreas Schlapsi — Sun, 16 Mar 2008 16:29:19 +0000

Ich hab hier einen interessanten Link gefunden: How to Run ASP.Net MVC on Mono. Wenn ich mal Zeit habe, werde ich das mal ausprobieren.

Links zu ASP.NET MVC

Andreas Schlapsi — Sun, 03 Feb 2008 22:14:20 +0000

Am Wochenende hatte ich ein wenig Zeit, um mich mal mit ASP.NET MVC zu beschäftigen. Wer noch nicht weiß, was ASP.NET MVC ist, kann sich in einem Blogartikel von Scott Guthrie informieren. Ein Vorteil von ASP.NET MVC ist die klare Trennung der Präsentations-, Geschäfts- und Datenzugriffslogik, wodurch sich Unit-Tests einfacher entwickeln lassen. Web-Forms klassischer ASP.NET-Applikation sind ja nicht so einfach testbar.

ASP.NET MVC ist Teil der Microsoft ASP.NET Extensions 3.5 Preview, die hier heruntergeladen werden kann. Technische Dokumentation gibt’s hier und wer Unterstützung braucht, findet sie im ASP.NET MVC-Forum.

Alle, die Visual Web Developer 2008 Express Edition verwenden, finden hier eine Schablone für ASP.NET MVC Web Sites.

Bei meinen ersten Experimenten mit ASP.NET MVC ist besonders die Artikelreihe von Scott Guthrie hilfreich:

Einige Blogartikel beschäftigen sich bereits damit, wie man AJAX-Applikationen mit ASP.NET MVC entwickeln kann:

Model-View-Controller und ASP.NET

Andreas Schlapsi — Tue, 23 Oct 2007 21:36:40 +0000

Scott Guthrie hat auf seinem Blog interessante Neuigkeiten: Eine Public Preview des ASP.NET MVC Frameworks wird noch dieses Jahr erscheinen. Nächstes Jahr wird ASP.NET MVC ein offizielles ASP.NET-Feature. Scott Hanselmann hat Videos von den Präsentationen auf der ALT.NET-Konferenz veröffentlicht.