Aktions-Menü in einer Spalte des Berichts

11.
Dezember
2018
Veröffentlicht von: Martina Meiszies

In diesem Monatstipp wird beschrieben, wie man in einer Spalte im Bericht in APEX ein Aktions-Menü anlegt.

Dieses Beispiel ist aus einer Anforderung heraus entstanden, dass man in einem Bericht, der alle Arbeitsstationen anzeigt, eine Spalte hat, in der man je nach Auswahl im Menü zu anderen Seiten weitergeleitet wird. Auf dieser Seiten bekommt man die entsprechenden Parameter und Berechtigungen zur jeweiligen Arbeitsstation angezeigt.

VORAUSSETZUNG

In diesem Artikel werden das Beispiel-Schema Scott und die Tabellen DEPT und EMP von Oracle verwendet. Die Tabelle DEPT beinhaltet die Abteilungen und die Tabelle EMP die Mitarbeiter, die in den Abteilungen arbeiten.

IN APEX

wird ein interaktiver Bericht mit folgender SQL-Abfrage angelegt:

select dname,                                                   -> Name der Abteilung
       loc,                                                     -> Standort
       deptno,                                                  -> Aktionen
       trim(both '''' from regexp_substr(
       apex_util.prepare_url('f?p=' || v('APP_ID') || ':2:' || V('APP_SESSION') ||
                             '::NO::P2_DEPTNO:' || DEPTNO ),       
                             '''f\?p=[^'']*''') ) as MENU_LINK  -> Ausgeblendete Spalte
from dept;

 

Da ab APEX-Version 5.0 die Session State Protection standardmäßig aktiviert ist und selbsterstellte URLs eine Prüfsumme benötigen, wird die Funktion APEX_UTL.PREPARE_URL verwendet, um diese  Prüfsumme hinzuzufügen.

Hinweis:
Die Session State Protection ist eine integrierte Funktion, die verhindert, dass Hacker die URLs in der Anwendung manipulieren. URL-Manipulationen können die Programmlogik, den Inhalt des Sitzungszustands und somit den Datenschutz beeinträchtigen.

 

Die Spalte DEPTNO hat als Spaltenformatierung folgenden HTML-Ausdruck:

<div class="report-actions">
<button type          ="button"
            class             ="t-Button t-Button--icon t-Button--noLabel js-menuButton"
            data-menu     ="actionsMenu"
            data-id       ="#DEPTNO#"
            data-title    ="#DNAME#"
<span aria-hidden="true" class="fa fa-chevron-down"></span>
</button>
</div>    


In den Seiteneigenschaften wird das nachfolgendes JavaScript eingefügt, welches immer automatisch beim Laden der Seite ausgeführt wird. Dem Menü werden 2 Verzweigungen hinzufügt und die Werte aus den Spalten DEPTNO und DNAME an die Seiten 2 bzw. 3 übergeben:

var menu$ = $("<div id='actionsMenu'></div>");
$("body").append(menu$);
menu$.menu({
          iconType: "fa",
          items: [   
            { type: "action",
              labelKey: "Mitarbeiter",                        
              icon: "fa-arrow-right",
              action: function(menu, btn) {
                // öffnet Seite 2
                var btn$ = $(btn);
                apex.navigation.redirect(apex.util.makeApplicationUrl({
                    pageId:2,
                    itemNames: ["P2_DEPTNO", "P2_DNAME"],
                    itemValues: [btn$.attr("data-id"), btn$.attr("data-title")]
                }));
                       }
            } ,
            { type: "action",
              labelKey: "Infos zum Standort",                        
              icon: "fa-arrow-right",
              action: function(menu, btn) {
                // öffnet Seite 3
                var btn$ = $(btn);
                apex.navigation.redirect(apex.util.makeApplicationUrl({
                    pageId:3,
                    itemNames: ["P3_DEPTNO", "P3_DNAME"],
                    itemValues: [btn$.attr("data-id"), btn$.attr("data-title")]
                }));
              }
            }       
          ]
});


So sieht dann der Bericht mit dem Aktions-Menü aus:

Nach Klicken auf den Menüpunkt “Mitarbeiter” wird man auf die Seite 2 weitergeleitet.

Eine Seite, die alle Mitarbeiter der jeweiligen Abteilung anzeigt, könnte dann so aussehen:


Über den Menüpunkt "Infos zum Standort" gelangt man auf die Seite 3, hier bekommt man alle Informationen zur Abteilung in New York, z. B.:

 

Sie planen eine APEX-Anwendung und haben nicht das notwendige Know-how?
Unsere APEX-Spezialisten ünterstützen Sie gerne bei der Konzeption und Umsetzung, Öffnet internen Link im aktuellen Fensterkontaktieren Sie uns einfach.

 

 

Bericht

Jede Menge Know-how für Sie!

In unserer Know-How Datenbank finden Sie mehr als 300 ausführliche Beiträge zu den Oracle-Themen wie DBA, SQL, PL/SQL, APEX und vielem mehr.
Hier erhalten Sie Antworten auf Ihre Fragen.