Auf dem Blog Path to SharePoint gibt es eine großartige Serie dazu, wie man in SharePoint-Listen und -Bibliotheken berechnete Spalten verwenden kann, in denen man HTML-Code unterbringt und so z.B. Ampelfunktionen oder Hyperlinks, die sich in einem neuen Fenster öffnen, ermöglichen kann.
Wir empfehlen den Besuch dieser Seiten und möchten hier ein kurzes Anwendungsbeispiel präsentieren.
Die Lösung in Kürze
- Man fügt eine berechnete Spalte in einer Liste/Bibliothek ein, die als Ergebnis ein Stück HTML-Code ergibt.
- Auf derselben Seite wird in einem Inhaltseditor-Webpart JavaScript-Code eingefügt, der in o.g. Blog zur Verfügung gestellt wird.
- Beim Öffnen der Seite sorgt nun das JavaScript dafür, dass in der Spalte nicht der HTML-Code als Text dargestellt wird, sondern dass dieser richtig umgesetzt wird und so Formatierungen etc. richtig dargestellt werden.
Unser Beispiel
In einer normalen Listenansicht sollen negative Zahlen rot, positive in grün dargestellt werden.
Dazu erstellen wir eine benutzerdefinierte Liste mit einer Zahlenspalte "Betrag".
Die berechnete Spalte
Zusätzlich erstellen wir eine Spalte mit einer berechneten Zahl. Hier nutzen wir die VERKETTEN- und die WENN-Funktion und erstellen so einen HTML-Ausdruck, der den Wert mit einer Formatierung versieht. Wichtig ist dabei, dass das Ergebnis des Ausdrucks einen DIV-Container enthält.
Weiterhin muss DIV in Großbuchstaben geschrieben sein!
Für unser Beispiel lautet die Formel folgendermaßen:
=VERKETTEN("<DIV style=’color:";WENN(Betrag<0;"red";"green");"’>";Betrag;"</DIV>")
Wir erstellen zwei Listeneinträge, und das Ergebnis sieht nun so aus:
Das Script
Nun fügen wir das Script ein, das wir im genannten Blog in folgendem Artikel finden und in die Zwischenablage kopieren:
http://pathtosharepoint.wordpress.com/2008/09/01/using-calculated-columns-to-write-html/
Öffnen Sie nun die Seite mit der Listenansicht bzw. die entsprechende Webpartseite im Bearbeiten-Modus und fügen ganz unten einen Inhaltseditor-Webpart ein. Bearbeiten Sie die Eigenschaften des Webparts und fügen im Quelltext-Editor den erwähnten JavaScript-Code ein.
Das Ergebnis
Nun noch den Bearbeitungsmodus beenden und das Ergebnis bewundern:
Weiter geht’s
Mit diesem Trick sind jetzt viele Dinge möglich, Ampeln, Fortschrittsbalken, Hyperlinks, die sich in einem neuen Fenster öffnen etc. Besuchen Sie die erwähnte Blog-Seite für Ideen, der Autor ist sehr aktiv und stellt immer wieder neue Lösungen vor.
