In questo articolo ti spiegherò come creare e personalizzare un Interactive Grid in Oracle APEX.

Questo componente, insieme all’Interactive Report, rappresenta il principale strumento attraverso il quale puoi implementare il reporting interattivo di Oracle APEX.

Infatti, se hai già letto il tutorial su come creare un Interactive Report, scoprirai che questi due componenti hanno molte caratteristiche in comune.

Entrambi ti permettono di estrarre i dati in formato tabellare, puoi implementare filtri, ordinare i campi e salvare viste personalizzate.

La sostanziale differenza tra questi due oggetti consiste nel fatto che, a differenza dell’Interactive Report, con un Interactive Grid puoi modificare i dati direttamente nella tabella.

Quindi, se sono così simili, quando conviene usare l’uno e quando l’altro?

Il mio consiglio è di usare un Interactive Grid in tutte quelle situazioni in cui gli utenti devono fare modifiche massive ai record, aggiungere righe e cancellarle perché, come vedremo, questo componente mette a disposizione out-of-the-box una serie di features ad hoc molto utili per questo tipo di operazioni.

Viceversa, puoi optare per una soluzione basata su Interactive Report + Form.

Cosa ti serve per implementare un Interactive Grid

Per costruire un report APEX basato su Interactive Grid hai bisogno di:

• La tabella che deve essere aggiornata.
• Un ambiente Oracle APEX su cui lavorare.

Se in questo momento non hai a disposizione un ambiente di sviluppo in APEX leggi la guida su come ottenere un ambiente Oracle APEX di prova.

Come creare un’applicazione con un Interactive Grid

Per fare questo tutorial creerò una applicazione che permetterà di leggere e modificare l’anagrafica dei dipendenti di una generica azienda.

Puoi creare una nuova applicazione da zero, oppure puoi aggiungere una pagina ad una tua applicazione di prova che hai creato.

Da questo link puoi scaricare lo script della tabella che userò insieme ad alcuni dati di esempio.

Crea una nuova applicazione

Se hai già una applicazione APEX e vuoi aggiungere una nuova pagina con un report interattivo, puoi tranquillamente saltare al paragrafo successivo.

Per creare una nuova applicazione, esegui i seguenti passaggi.

• Collegati ad Oracle APEX e seleziona App Builder

• Clicca sul bottone Create

• Seleziona New Application

• Dai un nome alla tua applicazione
• Premi Create Application

Crea una nuova pagina di tipo Interactive Grid

• Dall’App Builder di Oracle APEX, clicca sull’applicazione
• Clicca sul bottone Create Page

• Seleziona il tipo pagina Report e clicca Next

• Seleziona il componente Interactive Report e clicca su Next

• Dai un nome alla pagina e clicca su Next

• Crea automaticamente (se vuoi) la voce di menù dalla quale potrai richiamare la tua pagina

• Indica qual è la sorgente dalla quale l’Interactive Grid deve prendere i dati da mostrare.
• Ci sono diverse opzioni: in questo tutorial useremo una tabella.
  • Source Type: Table
  • Table: S_EMP
• Clicca Create

• Il sistema creerà una pagina con un componente di tipo Interactive Grid

• Possiamo fin da subito eseguire l’applicazione per vedere il risultato.
• In alto a destra, clicca sul bottone Esegui

• Questo è il risultato che dovresti ottenere

Bene, se sei arrivato fino a questo punto del tutorial dovresti aver creato la tua prima pagina con Interactive Grid.

Al momento non permette ancora di modificare i dati (di default viene creata in modalità read-only).

Per rendere l’Interactive Grid editabile è necessario lavorarci ancora un po’.

Nel prossimo paragrafo ti mostrerò come configurarla.

Come configurare un Interactive Grid

In questo paragrafo andremo ad analizzare quali sono le configurazioni principali che devi tenere a mente quando implementi un Interactive Grid.

Prima di procedere, completiamo il setup della nostra maschera creando le liste valori necessarie.

Setup delle liste valori

Poiché alcuni campi della nostra applicazione devono essere validati, andremo a creare delle liste valori.

Dobbiamo creare 3 LOV:

• TITLE_LOV: Dynamic LOV, basata sui valori della tabella S_TITLE
• MANAGER_LOV: Dynamic LOV, basata sui valori della tabella S_EMP
• DEPARTMENT_LOV: Dynamic LOV, basata sui valori della tabella S_DEPT

List Of Values TITLE_LOV

• Clicca su Shared Components

• Clicca su List Of Values

• Clicca su Create

• Seleziona l’opzione From Scratch e clicca su Next

• Dai un nome alla LOV e seleziona il tipo
  • Name: S_TITLE_LOV
  • Type: Dynamic

• Specifica la tabella dalla quale prendere i valori
  • Source Type: Table
  • Table Owner: lo schema APEX del tuo workspace
  • Table: S_TITLE

• Nella schermata successiva seleziona il campo che la lista valori deve visualizzare e restituire: TITLE

List Of Values DEPT_LOV

• Per creare questo tipo di lista valori, segui la procedura vista poco fa

• Specifica la tabella dalla quale prendere i valori
  • Source Type: Table
  • Table Owner: lo schema APEX del tuo workspace
  • Table: S_DEPT

• Specifica il valore che deve essere visualizzato dall’utente e quello che deve essere salvato nel database
  • Return Column: ID
  • Display Column: NAME

List Of Values EMP_LOV

Questa lista valori è sempre dinamica e basata su una query SQL.

• Per creare questo tipo di lista valori, segui la procedura vista poco selezionando il tipo LOV Dynamic
• Nella sezione in cui devi specificare la sorgente, indica SQL Query ed inserisce la seguente query:

select ID as RETURN_VALUE, 
       LAST_NAME||', '||FIRST_NAME AS DISPLAY_VALUE
  from s_emp

Setup dei campi dell’Interactive Grid

Ora che abbiamo creato le liste valori di cui abbiamo bisogno, possiamo completare il setup dei campi del nostro report.

Colonna TITLE

• Seleziona la colonna TITLE

• Cambia il tipo a Select List

• Imposta la lista valori S_TITLE_LOV

Colonna MANAGER_ID

• Seleziona la colonna MANAGER_ID

• Cambia il tipo a Popup LOV

• Imposta la lista valori S_EMP_LOV

Colonna DEPT_ID

• Seleziona la colonna DEPT_ID

• Cambia il tipo a Select List

• Imposta la lista valori DEPT_LOV

Setup Edit

Ora che abbiamo configurato le liste valori possiamo attivare l’opzione che rende la nostra Interactive Grid editabile.

• Seleziona l’Interactive Grid

• Clicca sul tab Attributes e vai alla sezione Edit
• Attiva l’opzione Enabled e specifica quali operazioni possono essere eseguite (Add Row, Update Row, Delete Row)

Impostare la primary key

• Seleziona la colonna ID che è mappata con il colonna ID della tabella S_EMP (è chiave primaria)

• Imposta il tipo campo ad Hidden

• Nella sezione Source seleziona l’opzione Primary Key

• Vai alla sezione Default ed imposta le seguenti proprietà
  • Type: Sequence
  • Sequence: S_EMP_SEQ
  • Duplicate Copies Existing Value: No

Setup Toolbar

La Toolbar di un Interactive Grid mette a disposizione dell’utente diverse funzionalità.

Vediamo quali sono le sue opzioni di configurazione.

• Show: mostra la Toolbar
• Search Columns Selection: permette di selezionare i filtri per colonna

• Search Field: mostra il campo di ricerca

• Action Menu: mostra il menù Actions

• Reset Button: mostra il bottone Reset

• Save Button: mostra il bottone Save

Setup Download

In questa sezione puoi stabilire in quali formati (tra quelli previsti) è possibile scaricare localmente i dati (purché sia stata abilitata la relativa Action)

Inoltre puoi definire come deve chiamarsi il file che viene generato.

Setup Pagination

Ti permette di decidere come navigare i record della griglia

• Type Scroll: la tabella mostra tutti i record possono essere visualizzati scrollando la barra di navigazione del browser
• Type Page: la tabella mostra un numero di record definito per pagina.

Come usare un Interactive Grid

Ora che abbiamo completato il setup necessario per usare la nostra Interactive Grid, puoi lanciare l’applicazione.

Aggiungere un record

• Per aggiungere un record clicca sul bottone Add Row

• Compila i campi richiesti e premi Save

Modificare un record

• Per modificare un record, clicca con il mouse sul campo che vuoi modificare.
• Quando hai fatto premi Save

Cancellare un record

• Per eliminare un record, clicca con il mouse sul menù di riga e seleziona Delete Row

• La riga viene marchiata come da cancellare. Premi Save per completare l’operazione.

Come visualizzare o nascondere le colonne

• Clicca su Actions > Columns

• Scegli quali colonne che mostrare o nascondere selezionandole con la check-box.
• Definisci l’ordinamento delle colonne.
• Clicca su Save.

Come filtrare i dati

In un modo del tutto identico all’Interactive Report, è possibile filtrare i dati anche nell’Interactive Grid.

Puoi usare il campo di ricerca della toolbar, oppure puoi creare filtri personalizzati.

Ricerca toolbar

• Scrivi nel campo di ricerca la stringa che vuoi cercare

• Premi il bottone per avviare la ricerca
• Vengono visualizzate tutte le righe che contengono la chiave di ricerca

Filtri veloci

• Clicca sulla colonna per la quale vuoi impostare un filtro
• Seleziona il valore del filtro da applicare

• Il filtro viene applicato

• Cliccando su filtro è possibile modificarne la condizione

Come ordinare i dati

• Clicca su Action > Data > Sort.

• Definisci la priorità di ordinamento.

• Clicca Save.

Come raggruppare i dati

• Clicca su Action > Form > Control Break.

• Aggiungere le colonne per le quali si vogliono raggruppare i dati.

• Clicca Save.

Come creare regole di formattazione condizionale

L’Interactive Grid permette di definirei regole di formattazione di righe e/o celle in funzione di una condizione personalizzata.

Questa funzionalità ricorda molto la formattazione condizionale di Excel.

• Clicca su Action > Forma > Highlight.

Inserisci i parametri di formattazione

• Nome: nome alla regola di formattazione.
• Highlight: specifica se la regola agisce su tutta la riga o solo su una cella specifica.
• Background Color: colore di sfondo della riga.
• Text Color: colore del testo della riga.
• Condition: specifica la regola che fa scattare la condizione.

• Clicca Save.

Come creare un grafico

• Clicca su Action > Chart.

• Seleziona il tipo di grafico che vuoi creare tra quelli disponibili ed imposta i parametri richiesti.

• Clicca Save.

Come salvare un report

Dopo aver personalizzato la visualizzazione della griglia puoi salvarla come report privato (filtri, ordinamento, colonne, ecc.).

In questo modo potrai applicare la tua visualizzazione preferita tutte le volte che vuoi senza doverla ricreare nuovamente

Oracle APEX ti da la possibilità di salvare tutte le viste private che vuoi.

• Clicca su Action > Report > Save As.

• Dai un nome alla tua vista.
• Clicca Save.

• La tua vista verrà salvata e potrai richiamarla in futuro selezionandola dal menù a tendina presente nella toolbar.