Widget erstellen, das eine ServiceNow-UI-Seite anzeigt

  • Freigeben Version: Zurich
  • Aktualisiert 31. Juli 2025
  • 2 Minuten Lesedauer
  • Sie können eine ServiceNow-UI-Seite erstellen, die eine Webseite anzeigt. Sie können diese UI-Seite dann einem Widget hinzufügen, das Dashboards hinzugefügt werden kann.

    Vorbereitungen

    Erforderliche Rolle: Administrator

    Warum und wann dieser Vorgang ausgeführt wird

    Eine UI-Seite ist eine ServiceNow-Seite, die keine Liste oder ein Formular ist. Nicht jede UI-Seite passt in ein Widget. Einige UI-Seiten, z. B. Widgets für externe Websites oder Gadgets, werden nicht ordnungsgemäß angezeigt, wenn sie in einem Dashboard platziert werden.

    Weitere Informationen zum Erstellen einer UI-Seite, ohne eine Framework-Seitenvorlage zu verwenden, finden Sie im Blog-Post Making a UI page without using the framework page template (UI-Seite ohne Framework-Seitenvorlage erstellen) eines Entwicklers in der ServiceNow-Community.

    Hinweis:
    Diese Funktionalität erfordert Kenntnisse in JavaScript.

    Prozedur

    1. Erstellen oder suchen Sie eine ServiceNow-UI-Seite, die Sie als Widget anzeigen möchten.
      Notieren Sie sich den Namen dieser UI-Seite, die in Schritt 4 verwendet werden soll. Der Name der UI-Seite ist der Wert des Namensfelds im Formular, in dem Sie den Inhalt der UI-Seite definieren.
    2. Navigieren zu System-UI > Widgets Und klicken Sie auf Neu .
      Widgets-Datensätze sind Widget-Kategoriedatensätze, keine Datensätze für einzelne Widgets. Wenn Sie dem Dashboard ein Widget hinzufügen, wählen Sie zuerst die Kategorie und dann das Widget aus. Das in Schritt 4 angegebene JavaScript enthält die Liste der Widgets, die in diese Kategorie aufgenommen werden sollen.
    3. Füllen Sie folgende Felder aus.
      FeldBeschreibung
      Name Der Name dieser Widget-Kategorie. Wählen Sie diese Kategorie aus, wenn Sie ihre Widgets zu einem Dashboard hinzufügen.
      Renderer-Typ Wählen Sie Aus JavaScript .
      Aktiv Löschen Sie dieses Feld, damit das Widget nicht mehr zu Dashboards hinzugefügt werden kann.
      Rollen Wählen Sie aus, welche Rollen diese Kategorie sehen können, wenn Widgets zu Dashboards hinzugefügt werden. Wenn Sie keine Rollen auswählen, können alle Rollen die Kategorie anzeigen.
    4. Fügen Sie das folgende JavaScript in hinzu Skript Feld, Ersetzungen wie angegeben vornehmen.
      Die Rückgabeanweisung enthält die Widgets, die in dieser Widget-Kategorie aufgeführt sind.
      Hinweis:
      Das Codefragment in diesem Schritt funktioniert in nicht bereichsbezogenen Anwendungen. Verwenden Sie das Codefragment in Schritt 5 für bereichsbezogene Anwendungen.
      Tabelle : 1.
      widget_name Der Name des Widgets, das der Anwender in der Widget-Auswahl auswählt, wenn das Widget einem Dashboard hinzugefügt wird. Diese Zeichenfolge wird auch in der Widget-Kopfzeile angezeigt. Dieser Wert ist der Name, den Sie in Schritt 3 konfigurieren.
      UI_page_name Der Name der UI-Seite aus Schritt 1, die im Widget angezeigt werden soll.
      function sections() {
          return {
              'widget_name': { 'uiPageName' : 'UI_page_name'},
              'widget_name2': {'uiPageName': 'UI_page_name_2'}
          };
      }
      
      function render() {
          var uiPageName = renderer.getPreferences().get("uiPageName");
          return renderer.getRenderedPage(uiPageName);
      }
      
      function getEditLink() {
          var uiPageName = renderer.getPreference('uiPageName');
          return 'sys_ui_page.do?sysparm_query=' + encodeURIComponent('name=' + uiPageName);
      }
    5. Wahlweise: Verwenden Sie dieses Codebeispiel für bereichsbezogene Anwendungen:
      function sections() {
          return {
          'Widget': {
          'type': 'widgetname'
          }
          };
      }
      
      function render() {
          var scope = gs.getCurrentScopeName();
          scope = (scope == "rhino.global" ? "" : scope + "_");
          var page = renderer.getPreference('type');
          return renderer.getRenderedPage(scope + page);
      }
      
      function getEditLink() {
          var scope = gs.getCurrentScopeName();
          scope = (scope == "rhino.global" ? "" : scope + "_");
          var page = renderer.getPreference('type');
          return "sys_ui_page.do?sysparm_query=name=" + scope + page;
      }
    6. Klicken Sie auf Absenden.

    Nächste Maßnahme

    Bearbeiten eines reaktionsfähigen Dashboards