Dialog bei Klick auf Lookup-Link abschalten

In SharePoint 2010 kann man bei Listen und Bibliotheken einstellen, ob die Listenformulare als Dialog geöffnet werden sollen oder nicht. Hyperlinks, die von Nachschlagefeldern (Lookups) erzeugt werden, beachten diese Einstellung aber nicht – sie werden immer als Dialog geöffnet. In diesem Beitrag soll gezeigt werden, wie man die Dialoge für diese Links abstellt.

Nachschlagefelder erzeugen bei der Ansicht immer einen Link auf das nachgeschlagene Element. Das gilt sowohl für das Standardanzeigeformular (DispForm.aspx) als auch für jede Listenansicht. Ein Klick auf einen solchen Link öffnet immer das Standardanzeigeformular des nachgeschlagenen Elements in einem Dialog. Dieser Dialog ist nicht immer erwünscht, z.B. wenn das Anzeigeformular selbst stark angepaßt wurde und deshalb möglichst viel Platz erhalten soll. Oder der Link soll sich gleich in einem neuen Fenster oder in einem neuen Reiter öffnen.

Um das zu erreichen, verwenden wir mal wieder jQuery. Wo man jQuery bekommt und wie man es einbindet, habe ich hier beschrieben.

Man geht dabei wie folgt vor: der Link eines Nachschlagefeldes wird bereits als normales <a>-Tag gerendert. Das Tag besitzt ein gültiges href-Attribut, das wir direkt verwenden können. Es besitzt aber auch ein onclick-Attribut, das für den Dialog verantwortlich ist. Wir müssen also nur die richtigen <a>-Elemente per JavaScript ausfindig machen und deren onclick-Attribut entfernen. Optional kann man dabei auch gleich ein target="_blank"-Attribut einfügen, falls sich die Links in einem neuen Fenster öffnen sollen.

Man öffnet dazu die Website in SharePoint Designer und navigiert zu der Liste oder Bibliothek, für die eine Ansicht angepaßt werden soll. Die Ansicht wird zum Bearbeiten geöffnet. In der Codeansicht sucht man das öffnende Element von PlaceHolderMain und fügt sein Script direkt darunter ein:

<asp:Content ID="Content1" ContentPlaceHolderId="PlaceHolderMain" runat="server">

Wenn man sich den Quelltext einer fertigen Seite im Browser anschaut, stellt man fest, daß die gesuchten Links alle mit der CSS-Klasse ms-vb2 versehen sind. Das machen wir uns zunutze, um die Links zu finden:

var allLinks = $(".ms-vb2 a");

Jetzt können wir die Links alle durchgehen und das onclick-Attribut entfernen:

allLinks.each(function() {
  $(this).removeAttr("onclick");
});

Das Ganze packen wir in eine handliche und wiederverwendbare Funktion:

function noDialogLinks() {
  var allLinks = $(".ms-vb2 a");
  allLinks.each(function() {
    $(this).removeAttr("onclick");
  });
}

Diese Funktion muß jetzt nur noch aufgerufen werden, sobald die Seite fertig geladen ist. Da Ansichten in SharePoint per Ajax geladen werden, müssen wir dabei eine kleine Verzögerung einbauen, damit sichergestellt ist, daß beim Ausführen unserer Funktion auch wirklich alle Daten zur Verfügung stehen:

$(document).ready(function() {
  setTimeout(noDialogLinks, 2000);
});

Hier wird eine Pause von 2.000 Millisekunden, also zwei Sekunden gemacht. In der Praxis sollte das ausreichen, damit die Daten geladen werden können und es sollte kurz genug sein, damit niemand vorher auf einen Link klickt.

Gruppierte Ansichten

Aufpassen muß man, wenn gruppierte Ansichten verwendet werden, die beim ersten Laden alle Knoten geschlossen/eingeklappt anzeigen. Hier werden die einzelnen Zeilen erst geladen, wenn ein Knoten geöffnet/ausgeklappt wird.

Damit unser Script in diesem Fall immer noch funktioniert, müssen wir alle Gruppierungsknoten ausfindig machen, an deren onclick-Funktion anhängen und dann ebenfalls wieder unsere noDialogLinks-Funktion aufrufen. Auch dabei müssen wir wieder eine kleine Verzögerung einbauen, weil die Daten erst geladen werden müssen. Der Code dazu sieht so aus:

var groupLinks = $(".ms-gb a");
groupLinks.each(function() {
  $(this).click(function() {setTimeout(noDialogLinks, 1500);} );
});

Hier nochmal zusammengefaßt das gesamte Script:

<script type="text/javascript">
function noDialogLinks() {
  var allLinks = $(".ms-vb2 a");
  allLinks.each(function() {
    $(this).removeAttr("onclick");
  });
}

$(document).ready(function () {
  setTimeout(noDialogLinks, 2000);
  var groupLinks = $(".ms-gb a");
  groupLinks.each(function() {
    $(this).click(function() { setTimeout(noDialogLinks, 1500); });
  });
});
</script>

6 Gedanken zu “Dialog bei Klick auf Lookup-Link abschalten

  1. Hallo Klaus,

    ich habe das ehrlich gesagt nur bei Listen getestet. In Kalendern wird sicher eine andere CSS-Klasse verwendet, aber in Bibliotheken müßte es funktionieren. Im Grunde mußt Du Dir nur den HTML-Quellcode anschauen und die richtige CSS-Klasse ins Skript einbauen (statt ms-vb2).

    Viele Grüße
    Andi

  2. Ein „return false“ im onclick sorgt dafür, daß beim Klick nur das Skript abgearbeitet wird und der eigentliche Link nicht aufgerufen wird. Wenn man das durch „return true“ ersetzt, wird das Skript ausgeführt und dann der Link aufgerufen. Deshalb bin ich den einfacheren Weg gegangen und habe das onclick komplett entfernt, so daß nur der eigentliche Link übrigbleibt.

  3. Hallo Markus,

    wenn Du Dir z.B. einen solchen Lookup-Link anschaust, dann siehst Du dort ein onlick-Attribut (genau das, welches wir hier entfernen). Dabei wird einfach nur eine Funktion OpenPopupPage aufgerufen. Die ist in der init.js und sollte deshalb immer zur Verfügung stehen.

    Dein Link sollte also so aussehen:

Hinterlasse eine Antwort zu Andi Antwort abbrechen