Tipp: Darstellung und Funktion von Listen und Spalten in SharePoint mit JavaScript erweitern (mit Video)
SharePoint bietet umfangreiche Möglichkeiten, um die Darstellung von Spalten in Listen oder Bibliotheken zu verändern. Seit SharePoint 2013 steht dafür als neue Technik das Client-Side-Rendering (CSR) zur Verfügung, um per JavaScript die Standarddarstellung durch eine individuelle Gestaltung der Ausgabe zu ersetzen. Darüber hinaus kann auch komplexe Logik ausgeführt werden. Der Vorteil: Da kein neuer Spaltentyp erstellt wird, lassen sich solche Anpassung jederzeit auf den Standard zurücksetzen, ohne Abhängigkeiten im System zu hinterlassen.
Vorbemerkung
Generell setzt das Erstellen einer individuellen Darstellungsmethode gewisse Programmierkenntnisse voraus. Für unser Beispiel stellen wir vorgefertigte Skripte als Download zur Verfügung. Voraussetzung für den Einsatz unseres Skripts ist, dass Sie Websitebesitzer sind.
Damit solche angepassten Spaltendarstellungen wiederverwendet werden können, sollte die Darstellungsmethode einer Websitespalte zugeordnet werden. So können Benutzer die Websitespalte ihrer Liste hinzufügen und haben ohne weitere Konfiguration die neue Darstellung in ihren Formularen und Listen.
1. Anlegen einer neuen Websitespalte
Klicken Sie in den Websiteeinstellungen in der Kategorie Web-Designer-Kataloge auf den Link Websitespalten. Vergeben Sie als Spaltenname Kompetenzniveau und wählen Sie als Informationstyp Auswahl (Menü). Klicken Sie auf OK, um die Websitespalte anzulegen.
2. Verlinkung mit der eigenen Darstellungsmethode
Navigieren Sie über die Websiteinhalte zur Websiteobjekte Bibliothek. Laden Sie die heruntergeladenen Dateien Kompetenzniveau.js und Kompetenzniveau.css in die Bibliothek hoch. Diese Dateien beinhalteten den gesamten Quellcode der eigenen Darstellungsmethode.
Für den nächsten Schritt benötigen Sie PowerShell. Wir verwenden in diesem Fall die SharePointPnP.PowerShell Commands. Passen Sie die URL im Skript Darstellungsmethode verlinken.ps1 an und führen Sie das Skript Darstellungsmethode verlinken.ps1 aus um die neue Websitespalte Kompetenzniveau mit der eigenen Darstellungsmethode zu verbinden.
3. Hinzufügen der Websitespalte zur Liste
Die Websitespalte Kompetenzniveau steht nun in Ihrer SharePoint Website mit der neuen Darstellungsmethode zur Verfügung.
Navigieren Sie zu einer Liste und öffnen Sie die Listeneinstellungen. Klicken Sie auf Aus vorhandenen Websitespalten hinzufügen im Bereich Spalten. Selektieren Sie in den verfügbaren Websitespalten die Websitespalte Kompetenzniveau und klicken Sie auf Hinzufügen. Klicken Sie auf OK, um die Websitespalte der Liste hinzuzufügen.
4. Testen der neuen Darstellung
Navigieren Sie zur Listenansicht und erstellen Sie ein neues Element. Die Spalte Kompetenzniveau wird im Listenformular mit dem neuen Design angezeigt.
Empfehlung
Es empfiehlt sich, die neue Websitespalte in der Websitesammlung anzulegen, denn so kann sie in der gesamten Websitesammlung verwendet werden. Das hier beschriebene Beispiel stellt einen relativ einfachen Anwendungsfall dar, Sie können jedoch auch sehr komplexe Geschäftsanwendungen mit der verwendeten Methodik umsetzen. Bei Fragen stehen wir von der IF-Blueprint AG Ihnen jederzeit zur Verfügung.
Das Video zum Tipp:
Als Teil der InterFace Group, die seit 1984 komplexe und unternehmenskritische IT-Projekte realisiert, stehen wir für Qualität und zufriedene Kunden in den unterschiedlichsten Branchen. Die besonderen Schwerpunkte unserer Geschäftstätigkeiten liegen in Beratungs- und Entwicklungsdienstleistungen zu den Microsoft Technologien SharePoint, Office 365 sowie Azure.