Cerca nel blog

lunedì 25 febbraio 2013

Oracle Apex e controlli JavaScript

Le potenzialità delle librerie Javascript sono ben consolidate nel contesto di Oracle Apex.
Risulta quindi possibile inserire frammenti di codice jscript per gestire ad esempio molteplici e sempre utili controlli client-side.
In questo articolo metteremo in evidenza  la possibilità di effettuare controlli client-side sugli item di una pagina/form della nostra generica web application sfruttando le potenziali di Javascript e non ricorrendo quindi a controlli server-side.
Creiamo quindi una generica web application nella quale definiremo la pagina controlli_jscript ed una html region con degli item su cui faremo validazione mediante controlli client-side jscript.
















La nostra semplice web application permette all'utente di inserire i dati anagrafici ed effettua il controllo di validazione sull'item P9_ETA verificando che il valore imputato  sia maggiore o superiore a 18 anni con alert di errore nel caso il valore fosse inferiore a 18.
La validazione dell'item P9_ETA sarà effettuata mediante una semplice funzione javascript che effettua in modalità client-side il controllo del valore inserito nell'item P9_ETA:


<script type="text/javascript">
function ControllaEta(object){
if(parseInt(object.value)<18)
alert('Valore non ammesso. Età inferiore a 18 anni');
}
</script>

il codice sarà inserito nella proprietà/tabs tab Html Header della pagina controlli_jscript:














mentre la chiamata della funziona ControllaEta sarà eseguita al verificarsi dell'evento javascript onblur (evento che scatta una volta che diventa passivo l'item P9_ETA):



















Ed ecco il risultato della validation sull'item P9_ETA una volta che viene inserito un valore inferiore a 18:













L'utilizzo delle librerie jscript in Oracle Apex consente di implementare molteplici controlli, quello visto in questo esempio richiede la scrittura di codice da parte dello sviluppatore mentre le dynamic action (ne parlo qui) consentono mediante wizard la realizzazione di potenti controlli che implementano nativamente codice jscrip e ajax.

Al prox post su......Oracle Apex.

Salvatore Bartucci

lunedì 18 febbraio 2013

Dynamic Action in Oracle Apex

Le Dynamic Action permettono di implementare controlli client-side sugli applicativi sviluppati in Oracle Apex mediante la combinazione di controlli Javascript ed Ajax.
La realizzazione di Dynamic Action avviene mediante l'uso di wizard guidati che facilitano notevolmente lo sviluppatore il quale non si preoccupa della stesura del codice Javascript.
Attraverso la creazione di dynamic action diventa quindi possibile attuare controlli client-side che permettono di nascondere/mostrare (meccanismo di hide/show) item o bottoni delle web form al verificarsi di particolari eventi sulla maschera (double click, valorizzazione di item, etc).
Vediamo un semplice esempio di utilizzo delle dynamic action, in particolare realizziamo una nuova pagina nella nostra web application nella quale saranno presenti due items nazione e descrizione.
Definiamo l'item nazione come select list con valori statici (Francia, Germania, Italia, Usa) mentre l'item descrizione sarà di tipo Text Area per contenere la descrizione della nazione che l'utente potrà inserire.
Realizziamo una semplice dynamic action che verifichi il valore della lista delle nazioni ed allorquando l'utente sceglie 'Italia' l'item descrizione sarà immediatamente valorizzato con un testo predefinito.
Creiamo quindi la pagina P_Dyn_Act di tipo blank page con all'interno la region html R_Dyn_Act ed associamo alla region gli item I1_DYN_ACT ed I2_DYN_ACT.
I1_DYN_ACT sarà di tipo select list e corrisponde alle nazioni mentre I1_DYN_ACT sarà di tipo text area e corrisponde alla descrizione delle nazioni.


Definiamo adesso la Dynamic action attraverso la quale l'utente una volta selezionata la nazione Italia dal select item avrà immediatamente valorizzato il campo descrizione con il testo seguente 'La penisola italiana si trova nel cuore del mediterraneo.'
Attraverso il wizard a livello di item I1_DYN_ACT creiamo la Dynamic action Dyn_Nazione, l'evento che scatenerà la Dynamic Action sarà il 'change' nel select item delle nazioni, in particolare nella sezione When viene indicato l'item I1_DYN_ACT con condition equal to al valore Italia:



Definiamo le condizioni true e false della dynamic action in base alle quali l'item della descrizione I2_DYN_ACT assumerà il valore predefinito (caso true = Italia) oppure apparirà vuoto e quindi pronto all'inserimento di testo nel caso condizione false.
















La condizione true con il relativo valore ('La penisola italiana...') che assumerà l'item I2_DYN_ACT:










La condizione false con l'azione di clear dell'item I2_DYN_ACT:















Infine eseguendo la web application avremo il risultato seguente nel caso di nazione diversa da Italia:










Mentre la selezione del valore Italia comporterà il caricamento in automatico nel campo descrizione:










Attraverso le dynamic action si possono implementare sofisticati meccanismi client side che rendono le web application molto funzionali ed estremamente dinamiche agli eventi che scaturiscono nel flusso di selezione dei dati.

Al prox post su...Oracle Apex

Salvatore Bartucci