Beispiele für anwenderdefinierte interaktive Filter

  • Freigeben Version: Zurich
  • Aktualisiert 31. Juli 2025
  • 6 Minuten Lesedauer
  • Als Administrator können Sie benutzerdefinierte interaktive Filter-Widgets erstellen, um erweiterte Filteroptionen in Dashboards bereitzustellen.

    Anwendungsfall

    In diesem Beispiel wird beschrieben, wie Sie einen anwenderdefinierten Filter erstellen, um Berichte in der Aufgabentabelle oder ihren untergeordneten Tabellen zu filtern. Der Filter zeigt nur Datensätze an, bei denen der aktuelle Anwender der Anrufer ist. Der Filter stellt dem Benutzer zwei Schaltflächen zur Verfügung, eine Schaltfläche zum Hinzufügen des Filters und eine zum Entfernen des Filters.

    Erstellen Sie ein anwenderdefiniertes interaktives Filter-Widget

    Erstellen Sie anwenderdefinierte interaktive Filter-Widgets, um erweiterte Filteroptionen in Dashboards bereitzustellen.

    Vorbereitungen

    Erforderliche Rolle: Administrator

    Prozedur

    1. Öffnen Sie ein Dashboard, dem Sie den anwenderdefinierten interaktiven Filter hinzufügen möchten.
    2. Klicken Sie auf das Symbol zum Hinzufügen von Inhalten (Symbol für Inhalte hinzufügen).
    3. Von Widget-Kategorie Liste, wählen Sie aus Inhaltsblöcke .
      Widget-Kategoriemenü mit ausgewählten Inhaltsblöcken
    4. Wählen Sie aus der Liste der Inhaltsblöcke aus Neuer Dynamischer Inhalt .
    5. Klicken Sie im Bereich „neuer dynamischer Inhalt“ auf Hinzufügen .
      Neue Widget-Option für dynamischen Inhalt
      Dem Dashboard wird ein neuer dynamischer Inhaltsblock hinzugefügt.
    6. Klicken Sie im Dashboard auf den Link, der besagt Klicken Sie hier, um diesen wiederverwendbaren dynamischen Inhaltsblock zu konfigurieren .
      Neue Widget-Option für dynamischen Inhalt
    7. Definieren Sie die Filterlogik in Dynamischer Inhalt Feld.
      Dynamischer Inhalt - Neuer Datensatz

    Nächste Maßnahme

    Definieren Sie die Filterlogik.

    Filterlogik definieren – Beispiel

    Nachdem Sie den interaktiven Filter erstellt haben, fügen Sie die Filterlogik hinzu.

    Vorbereitungen

    Erforderliche Rolle: Administrator

    Filter verwenden die Klasse DashboardMessageHandler, um aktive Filter zu verwalten. Instanziieren Sie DashboardMessageHandler mit einem eindeutigen Wert.
    Hinweis:
    Die ID des benutzerdefinierten interaktiven Filters muss eindeutig sein. Wenn sie dieselbe ID wie ein anderer interaktiver Filter oder anwenderdefinierter interaktiver Filter hat, funktioniert die Filterlogik ordnungsgemäß.

    Prozedur

    1. Fügen Sie im dynamischen Inhaltsdatensatz die Filterlogik dem XML-Block für dynamischen Inhalt hinzu.
    2. Die Schaltfläche Nur meine publiziert einen Filter für die Berichte der Aufgaben-Tabelle mit der codierten Abfrage caller_idDYNAMIC90d1921e5f510100a9ad2572f2b477fe.
      Mit der Schaltfläche Alle Aufgaben wird der Filter entfernt.
    3. Anschließend können Sie dem dynamischen Inhalt beliebige Schaltflächen oder andere Schnittstellenelemente hinzufügen. In diesem Beispiel werden der Code für die Funktion clearFilter() und die Schaltflächen im Filter unterhalb der Funktion publishFilter() hinzugefügt.
      <?xml version="1.0" encoding="utf-8" ?>
      <j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
       <script>
           var my_dashboardMessageHandler = new DashboardMessageHandler("my_unique_id");
          
          function publishFilter () {
              var filter_message = {};
              filter_message.id = "my_unique_id";
              filter_message.table = "task";
          
          <!--     Add your own filter query logic here -->
              filter_message.filter = "assigned_toDYNAMIC90d1921e5f510100a9ad2572f2b477fe";
              SNC.canvas.interactiveFilters.setDefaultValue({
                      id: filter_message.id,
                      filters: [filter_message]
                  }, false);
              my_dashboardMessageHandler.publishFilter(filter_message.table, filter_message.filter);
          }
          
          function clearFilter() {
              var filter_message = {};
              filter_message.id = "my_unique_id";
              filter_message.table = "task";
              filter_message.filter = "";
              SNC.canvas.interactiveFilters.setDefaultValue({
                      id: filter_message.id,
                      filters: [filter_message]
                  }, false);
              my_dashboardMessageHandler.removeFilter();
          }
       </script>   
       
      Example of a filter that generates a static filter on 'task' table reports, or removes it <br/>
          <input id="allTasks" type="button" value="All tasks" onclick="clearFilter();" />
          <input id="onlyMine" type="button" value="Only mine" onclick="publishFilter();" />
          
      </j:jelly>
    4. Wählen Sie Absenden.

    Ergebnisse

    Der anwenderdefinierte interaktive Filter wird im Dashboard angezeigt, dem Sie den dynamischen Inhaltsblock hinzugefügt haben. Sie befindet sich auch in der Liste der Inhaltsblöcke in Fügen Sie Widgets Hinzu Bereich.

    Erstellen Sie eine anwenderdefinierte Filteroption für Datum/Uhrzeit

    Wenn die Standardauswahl von Datums-/Uhrzeitfilteroptionen Ihren Anforderungen nicht entspricht, können Sie eine anwenderdefinierte Option erstellen.

    Vorbereitungen

    Führen Sie diese Schritte aus, um eine anwenderdefinierte Filteroption für Datum/Uhrzeit zu erstellen, die dann in einen beliebigen interaktiven Datums-/Uhrzeitfilter zur Verwendung in einem Dashboard aufgenommen werden kann. In diesem Beispiel erstellen Sie eine Filteroption für den Zeitraum von zwei Wochen, also zwei Wochen.

    Erforderliche Rolle: admin.

    Prozedur

    1. Navigieren zu Alle > Systemdefinition > Business-Regelnan.
    2. Öffnen Sie die Business-Regel „Datumsfilteroptionen für Datumsfilter abrufen“.
      Diese Regel füllt die Liste der auswählbaren Optionen in Formularen für neue oder vorhandene interaktive Filter vom Datumstyp aus.
    3. Auf Erweitert Ändern Sie die Registerkarte Skript Feld zum Einbeziehen des JavaScript, das zum Hinzufügen der neuen Option erforderlich ist.
      Fügen Sie die folgende Zeile hinzu:
      answer.add('<Time_Period_Name>@javascript:<Beginning_Time_Period>@javascript:<Ending_Time_Period>', gs.getMessage('<Textual_Representation_Of_Time_Period>'));
    4. Nehmen Sie in der von Ihnen hinzugefügten Zeile die folgenden Ersetzungen vor.
      OptionBezeichnung
      <Time_Period_Name> Ein eindeutiger Name für den ausgewählten Zeitraum. Diese Zeichenfolge wird intern vom System verwendet, um die Option zu identifizieren, und ist auf etwas festgelegt, das den beschriebenen Zeitraum beschreiben kann.

      Geben Sie den Wert ein 112_Letzte 14 Tage .

      <Beginning_Time_Period> Das spezifische Datum und die bestimmte Uhrzeit, an der dieser Filter beginnt. Dieser Wert kann absolute oder relative Werte verwenden. Es ist viel häufiger, einen relativen Wert zu verwenden, der die JavaScript-URL-Syntax verwendet.

      Geben Sie den Wert ein gs.daysAgoStart (14) Gibt an, dass das Zeitintervall für diese Auswahl genau zwei Wochen zurückliegen soll.

      <Ending_Time_Period> Das spezifische Datum und die bestimmte Uhrzeit, zu der der Zeitraum für diese Filteroption enden soll Dieser Wert kann auch absolute oder relative Werte verwenden. Ähnlich wie Beginning_Time_PeriodDieser Wert ist normalerweise ein relativer Zeitraum für die Verwendung der JavaScript-URL-Syntax.

      Geben Sie den Wert ein gs.daysAgoStart (0) Gibt an, dass der Zeitraum am aktuellen Datum und zur aktuellen Uhrzeit endet.

      <Textual_Representation_Of_Time_Period> Eine kurze Textzeichenfolge, die in der Liste der Filteroptionen für Datum/Uhrzeit angezeigt wird, die in aufsteigender alphabetischer Reihenfolge angezeigt werden.

      Eingabetaste Letzte 14 Tage , Um anzugeben, dass diese Auswahl einen Zeitraum von zwei Wochen vor dem aktuellen Datum und der aktuellen Uhrzeit angibt.

      Die vollständige Anweisung lautet jetzt:
      answer.add('112_Last Fortnight@javascript:gs.daysAgoStart(14)@javascript:gs.daysAgoEnd(0)', gs.getMessage('Last fortnight'));
    5. Wählen Sie Aus Aktualisieren Um Ihre Änderungen an der Business-Regel zu speichern.
    6. Überprüfen Sie, ob die neue Option verfügbar ist, wenn Sie einen Datums-/Uhrzeitfilter bearbeiten oder erstellen.
      1. Navigieren zu Alle > Berichte > Administration > Interaktive Filteran.
      2. Wählen Sie einen Datumsfilter aus.
        Die verfügbaren Filter umfassen Letzte 14 Tage .
        Verfügbare Datumsfilteroptionen, einschließlich der letzten 14 Tage
    7. Bearbeiten Sie einen Datumsfilter, um den neuen Wert einzubeziehen, und fügen Sie den Filter einem Dashboard hinzu.
      Ein Datumsfilter mit der Option „Letzte 14 Tage“

    Beispiel für anwenderdefinierten interaktiven Filter – mehrere Berichte

    Sie können einen anwenderdefinierten interaktiven Filter verwenden, um mehrere Berichte mithilfe verschiedener Tabellen zu filtern. Es gibt zwei verschiedene APIs zum Veröffentlichen eines interaktiven Filters für eine einzelne Tabelle oder mehrere Tabellen. Dieses Beispiel filtert einen Bericht zu den Incident- und Problemtabellen nach Zuweisungsgruppe mithilfe eines anwenderdefinierten interaktiven Filters.

    Über anwenderdefinierte interaktive Filter in mehreren Tabellen

    Beachten Sie Folgendes, wenn Sie einen anwenderdefinierten interaktiven Filter erstellen:
    • Anwenderdefinierte interaktive Filter, die nur für eine Tabelle gelten, verwenden die Funktion DashboardMessageHandler.publishFilter() .
    • Anwenderdefinierte interaktive Filter, die für mehrere Tabellen gelten, verwenden die Funktion DashboardMessageHandler.publishMessage() .
    • Vor der Veröffentlichung wird ein interaktiver Filteraufruf an durchgeführt SNC.canvas.interactiveFilters.setDefaultValue() Funktion ist erforderlich.
    • Ein Anruf an entweder SNC.canvas.interactiveFilters.removeDefaultValue() Oder DashboardMessageHandler.removeFilter() Funktion ist erforderlich, bevor Sie den Filter zurücksetzen.

    Ein anwenderdefinierter interaktiver Filter, der aufruft PublishFilter() Mit der Methode wird der zugeordnete Bericht mehrmals mit derselben Anzahl aktualisiert. Wiederholte Aufrufe dieser Methode können Leistungsprobleme verursachen.

    So wenden Sie anwenderdefinierten interaktiven Filter auf mehrere Tabellen an

    Das folgende Beispiel filtert den Bericht nach Zuweisungsgruppe in den Tabellen „Incident“ [Incident] und „Problem“ [Problem].

    DashboardMessageHandler.publishMessage() Akzeptiert mehrere Filter als Array. Erstellen Sie das Filter-Array, und erstellen Sie dann eine einzelne Instanz von DashboardMessageHandler Die anruft DashboardMessageHandler.publishMessage([Filter]) . Diese Methode aktualisiert das Widget nur einmal.

    <?xml version="1.0" encoding="UTF-8"?>
    <j:jelly xmlns:j="jelly:core" xmlns:g="glide" xmlns:g2="null" xmlns:j2="null" trim="false">
       <script>
          var my_dashboardMessageHandler = new DashboardMessageHandler("my_unique_id");
    
    function publishMultipleFilter() {
          <!-- Mutliple filters can be passed as an array -->
          var finalFilter = [{"table":"incident","filter":"assignment_group=6fcd3b573b331300ad3cc9bb34efc447"}, {"table":"problem","filter":"assignment_group=6fcd3b573b331300ad3cc9bb34efc447"}];
          <!-- call setDefaultValue first -->
          SNC.canvas.interactiveFilters.setDefaultValue({
    id: my_dashboardMessageHandler._unique_id,
    filters: finalFilter,
    }, false);
          <!-- then call Publishmessage to publish filters-->
          my_dashboardMessageHandler.publishMessage(finalFilter);
    }
    
    function clearFilter() {
    SNC.canvas.interactiveFilters.removeDefaultValue(my_dashboardMessageHandler._unique_id, false);
    my_dashboardMessageHandler.removeFilter();
    }
       </script>
       
    Example of a filter that filters incident and problem table where the assignment group is Problem solving
       <input id="allTasks" type="button" value="All" onclick="clearFilter();" />
       <input id="onlyMine" type="button" value="Assignment group is [Problem solving]" onclick="publishMultipleFilter();" />
    </j:jelly>