SharePoint Blog

jQuery Cookbook

In Bezug auf jQuery könntet man denken, dass alles schon gesagt ist. Höchstens nocht nicht von allen! Auf jeden Fall noch nicht von mir. Allerdings sollte man bedenken, dass ich kein Profi-Entwickler schlechthin bin. Es ist wahr, dass ich gerne auch mal Software entwickele. Aber mit einem Informatiker, der sein Studium summa cum laude absolviert hat, kann und möchte ich nicht mithalten. Gerade vor diesem Hintergrund könnte es interessant sein, hier kurz meine jQuery-Recherchen in Zusammenhang mit SharePoint aufzuzeichnen: Nicht für den Experten, sondern für die erfahrenen Anfänger!

In letzter Zeit sind immer wieder neue Technologien an die Oberfläche aufgetaucht. Ausdrücke wie Ruby On Rails, Google Web Toolkit aber auch jQuery lassen es bei vielen sicherlich klingeln. Viele dieser neuen Technologien sind allerdings nicht neu-neu, sondern vielmehr handelt es sich um eine weitere Abstraktion einer bestehenden Technologie. So auch im Fall von jQuery. jQuery ist im Grunde eine JavaScript-Erweiterung (eine sogenannte Klassenbibliothek) die vor allem UI-Entwickler unterstützt weil sie:

  1. Komfortable Funktionen zur DOM-Manipulation und DOM-Navigation zur Verfügung stellt. Anders formuliert: Mit jQuery kann ein UI-Entwickler auf einfacher Art und Weise HTML-Elemente selektieren, manipulieren und Leben einhauchen.
  2. Moderne AJAX-Funktionen implementiert und somit ist die asynchrone Kommunikation zwischen Browser und Server und die Verarbeitung der asynchron gesammelten Daten durch DOM-Manipulation Kinderspiel.
  3. Eine Vielvalt von Browsern und Betriebssysteme unterstützt.

Noch mal anders formulier: jQuery ist eine JavaScript-Klassenbibliothek die kleiner als 20Kb ist und Entwicklern fast unendliche Möglichkeiten beim Erstellen dynamischer Web Applikationen bietet.

Die zentrale Frage ist allerdings ob und wenn ja wie ein SharePoint-Entwickler AJAX optimal einsetzen kann und ob jQuery da überhaupt Sinn macht. Diese Frage ist ein Fallgruben: jQuery ist nicht gleich AJAX sondern bietet auch -wie oben bereits erwähnt- eine Reihe Funktionen zur DOM-Manipulation und DOM-Navigation. Diese Funktionen stehen zwar in einem engen Zusammenhang mit einenander, sollten allerdings separat betrachtet werden. Einerseits bietet AJAX dem Entwickler eine Technologie um “unbemerkt” asynchrone HTTP-Anfragen auszuführen um so Anwender-Daten zu verarbeiten ohne dass die HTML-Seite neugeladen wird. Anderseits ist AJAX kein Regelwerk, das vorschreibt wie die HTML-Seite manipuliert werden soll. Anders formuliert, diktiert AJAX nicht wie die Auswirkung der Verarbeitung der Anwender-Daten browserseitig realisiert werden soll.

Welche AJAX-Optionen stehen dem SharePoint-Entwickler eigentlich zur Verfügung?

Option 1: UpdatePanel

Hier soll ich wirklich kurz sein. Die Idee mit dem UpdatePanel ist mir bereits seit Jahren unsympatisch. Das Konzept wobei die Seite bei jeder asynchronen HTTP-Anfrage komplett neu ausgeführt wird um dem erzeugten HTML-Output ein einziges DIV-Element zu entnehmen was dann schliesslich zurück an den Browser gesendet wird ist unglaublich ineffizient und führt früher oder später zu Probleme. Das interessante dieses Ansatzes ist allerdings, dass ein UI-Element wie z.B. ein DIV-Element nicht browserseitig sondern serverseitig aufbereitet wird. Das aufbereitete Element wird dann in der vorliegenden Form zurück an den Browser gesendet und ersetzt das bisherige DIV-Element.

Option 2: ASP.NET AJAX 4.0 / ASP.NET AJAX Control Toolkit

Ein erfahrener SharePoint 2010 Anwender wird nicht entgangen sein, dass in SharePoint 2010 Seiten nicht immer neu geladen werden. Vielmehr scheinen da unbemerkt Daten asynchron zwischen Browser und Server zu fliessen ohne dass die Seite langsam wirkt oder gar nicht mehr reagiert (was im Fall des UpdatePanels noch regelmässig passieren konnte). Die gute Nachricht ist, dass die hier verwendete Technologie auch von Entwicklern eingesetzt werden kann. Mehr Information findet man auf CodePlex: http://ajaxcontroltoolkit.codeplex.com/. In diesem Fall würde man viele UI-Elemente aus dem dem ASP.NET AJAX Control Toolkit verwenden, wie z.B. eine Animation, Accordion oder das DragPanel. Ich möchte hier kein ASP.NET AJAX 4.0 Beispiel zeigen. Dafür verweise ich zum Beispiel mal gerne auf die interessante Serie von Lee Richardson http://www.nearinfinity.com/blogs/lee_richardson/client_side_ajax_applications.html. Mit ASP.NET AJAX 4.0 ist die asynchrone Kommunikation zwischen Browser und Server schlicht, einfach und verständlich abgedeckt. Wichtiger noch, die Technologie bietet eine klasse Unterstützung von ADO.NET und somit bestehen klare Vorteile wenn es geht um die Integration von WCF-Services (und somit wenn es geht um die Anbindung von SharePoint Web Services).

Option 3: ASP.NET AJAX 4.0 / jQuery

Möchte man diesbezüglich nicht die ASP.NET AJAX Control Toolkit verwenden, zum Beispiel weil die jQuery UI Bibliothek mehr Möglichkeiten bietet, kommt man nicht an jQuery vorbei. Mit ASP.NET AJAX 4.0 ist es jetzt möglich nur Datenpakete mit einem (Web-) Dienst auszutauschen, z.B. im JSON- oder XML-Format. Das impliziert, dass diese Daten browserseitig noch verarbeitet werden müssen. Sprich, es braucht noch eine Logik, die HTML-Elemente selektiert, manipuliert und Leben einhaucht. Hier ist jQuery schlicht, einfach und … Na ja, verständlich erst dann, wenn man folgendes Buch gelesen hat …

jQueryCookbook

Weiter lesen …

Vor kurzem wurden auf SharePointMagazine.net zwei spannende Blogposts veröffentlicht, die ebenfalls das Zusammenspiel zwischen SharePoint und jQuery versuchen zu erklären: http://sharepointmagazine.net/articles/a-jquery-primer-for-sharepoint und http://sharepointmagazine.net/articles/a-jquery-primer-for-sharepoint-selectors-attributes-and-traversing-oh-my.

Copyright ©2012. All Rights Reserved.