Indice articolo

Il componente Field (FLD) è un vero e proprio componente a pari di una matrice o di un albero, grazie al quale possiamo realizzare dei semplici campi di input molto velocemente e senza dover scrivere servizi.

Fino a poco tempo fa, se volevamo implementare anche un solo campo di input, eravamo obbligati a definire una sezione con un componente inputpanel (INP), e quindi creare un servizio di aggiornamento da utilizzare, la procedura poteva risultare molto lunga per avere come risultato un singolo campo. Ora grazie al componente “Field” questa procedura risulta molto più snella e veloce!

Esempi di componenti grafici definibili in una sezione field

In una sezione field possiamo definire gli stessi tipi di campo che potremmo utilizzare in un inputpanel. Vediamo rapidamente i più utilizzati:

Il tipo più utilizzato è sicuramente l’autocompleate (Acp) che, come indica il nome, autocompleta la parola che abbiamo iniziato a scrivere. Di seguito un esempio di campo di field con autocomplete e lo script che genera questa sezione.

::G.SEZ Pos(1) 
  ::G.SUB.FLD Tit="Sezione con autocompleate"     
  ::G.SET.FLD Type="Acp" 
  -- funzione di caricamento... una normale lista di oggetti CNCOL
    ::D.FUN.STD F(TRE;LOA10_SE;ELK.COM) 1(CN;COL;) P(K([K1]))

Un altro tipo molto utilizzato è quello della combo (Cmb), che ci permette di scegliere tra tutti i valori possibili. Molto utile se i valori sono definiti tramite D.OGG e quindi non molti disponibili.

di seguito lo script che genera questa sezione:

::G.SEZ Pos(1) 
  ::G.SUB.FLD Tit="Sezione di campi con combo"     
  ::G.SET.FLD Type="Cmb"
    -- questa fun ritorna un albero a più livelli
    ::D.FUN.STD F(TRE;B£SER_46;WRK.SXM) 1(MB;SCP_SET;WETEST_FLD) 2(;;TBL002)

Poichè i field vengono caricati da xml di albero, gestiscono anche la specifica ::D.OGG:

::G.SUB.FLD Tit="*NONE" SubNote="Esempio di combo con Lista di D.OGG con SelFirst" 
::G.SET.FLD Type="Cmb" SelFirst="Yes"
  ::D.OGG T(CN) P(COL) K(CARLUC) D(Luca Carminati)
  ::D.OGG T(CN) P(COL) K(CASFRA) D(Francesco Casetta)
  ::D.OGG T(CN) P(COL) K(DELGIO) D(Giovanni Del Bono)
  ::D.OGG T(CN) P(COL) K(FEDROB) D(Roberto Fedrigotti)
  ::D.OGG T(CN) P(COL) K(FIOGIA) D(Gianluca Fioletti)
  ::D.OGG T(CN) P(COL) K(PARFRA) D(Franco Parodi)
  ::D.OGG T(CN) P(COL) K(SANCOS) D(Mauro Sanfilippo)

Sempre in una sezione field è anche possibile definire l’inserimento di un calendario, Per un’imputazione veloce di una data.

di seguito lo script che genera questa sezione:

::G.SEZ Pos(1)    
  ::G.SUB.FLD Tit="Sezione con calendario"     
  ::G.SET.FLD Type="Cal"
    ::D.OGG T(D8) P(*YYMD)

Un altro tipo implementabile, molto interessante, è il “File upload” cioè la possibilità di caricare un qualsiasi tipo di file che sia un PDF oppure un’immagine! Di questo componente possiamo anche definire la grandezza massima del file di cui vogliamo fare l’upload, oppure definire solo un formato file accettato (es. .JPG). Possiamo anche definire la scritta che comparirà nel bottone di conferma upload. Se si vuole approfondire l’argomento dell’upload di file vi rimando all’articolo upload di un file. 

di seguito lo script che genera questa sezione:

::G.SEZ Pos(1) 
::G.SUB.FLD Tit="Sezione con upload di file"  
::G.SET.FLD Type="Fup" FilePath="c:\tmp" Load="D"
::D.OGG T() P() K()

Una nuova sezione FLD che possiamo definire è quella Tri State Check Box, un nuovo componente di tipo check box, il quale oltre ai classici valori “true/false” aggiunge la possibilità di scegliere lo stato “vuoto”. Esplicativa è l’immagine seguente con gli esempi dei tre stati.

Di seguito lo script che genera questa sezione:

::G.SEZ Pos(1) 
::G.SUB.FLD Tit="Sezione con tri state check box"  
::G.SET.FLD Type="Tsc"

Oltre a questi componenti (che sono quelli più utilizzati) c’è ne sono molti altri!

Continuate la lettura del articolo per saziare la vostra sete di conoscenza sulla sezione FIELD!

Tutti i componenti grafici utilizzabili in una sezione field (Oggetto V2FOGOG)

In questo elenco verranno indicati tutti i componenti grafici utilizzabili all’interno di una sezione FIELD, che sono istanze della classe V2FOGOG.

  • ACP – Autocompleate
  • AML – Autocompleate Multiplo
  • ASD – Ordinamento
  • BCD –  Barcode
  • BLB – Boolean Button (V2 SI/NO)
  • BTM – Many Button
  • BTN –  Button
  • BTO – One Button
  • CAL – Calendario
  • CFG – Configurazione
  • CFM – Configurazione multiplo
  • CHI – Chips
  • CHK – Check Box
  • CHL – Check Box List
  • CHM – Check Box Menu
  • CLP – ColorPicker
  • CMB – Combo Box
  • DEC – Decode
  • EDT – Editor
  • FRE – File reader (J1PATHFILE)
  • FUP – File upload (J1PATHFILE)
  • GRA – Grafico
  • IMG – Immagine
  • INR – Input Number
  • ITX – Input Text
  • KEY – Keyboard
  • KNB – Knob
  • LBL – Label
  • LST – List Box
  • MDF – MarkDown Field
  • MEM – Memo (J1TXT)
  • MLV – Valori Multipli
  • PCK – PickList
  • PGB – ProgressBar
  • PWD – Password
  • RAD – Radio Button
  • RNG – Range
  • RTG – Rating
  • SIG – Signature
  • SLD – Slider
  • SPN – Spinner
  • SRC – Search
  • SWT – Switch
  • TBL – Tabella
  • TIM – Time
  • TPK – TimePicker
  • TSC – Tri State Check Box

Per avere esempi pratici e ulteriori spiegazioni su questi componenti, vi invito a visionare lo showcase di Web.UP, nello specifico la sezione dedicata al componente “FLD – Field“.

Perché utilizzare una sezione Field

Quando si ha bisogno di un solo campo di inserimento possiamo utilizzare una sezione field, che non necessità (e non supporta nemmeno!) di nessun servizio di aggiornamento. Le ricerche vengono eseguite tramite FUN oppure andando noi a definire da parametri di ricerca selezionabili poi dall’utente.

La fondamentale caratteristica di questo componente, essendo di input, è la possibilità di gestire degli eventi per segnalre l’avvenuto input da parte dell’utente.

Vengono gestiti due tipi di dinamismo: il “Change” scatterà alla selezione di uno degli elementi di una lista, o all’uscita da un campo di testo; il “Click” scatterà alla pressione del tasto “conferma/invio”. E’ in oltre possibile, se si desidera, definire un valore di default.

Un altro importante utilizzo di questo componente è la possibilità di usarlo per funzioni di navigazione e/o sostituzione di una struttura ad albero. come è stato fatto per la gestione dei TODO del laboratorio. In cui al click sui uno dei Radio Button visibili in alto (i miei todo – scrum – ecc..) viene ricaricata la parte sottostante, a fronte di un dinamismo al change.

Come definire una sezione “FLD” con dinamismo in uno script di scheda

Vediamo ora come definire a livello di script di scheda una sezione field e un esempio di dinamismo:

::G.SEZ Pos(1)
 ::G.SUB.FLD Tit="Sezione con autocompleate" 
 ::G.SET.FLD Type="Cmb"
 ::G.DIN Where="LABEL" When="Change"
 ::G.DIN Where="LABEL2" When="Click"
 ::D.FUN.STD F(TRE;LOA10_SE;ELK.COM) 1(TA;B£W00;)

::G.SEZ Pos(2)
::G.SUB.LAB Tit="Change" Id="LABEL"
::D.OGG D(Valore oggetto T1;P1;K1 = [T1];[P1];[K1])

::G.SEZ Pos(3)
::G.SUB.LAB Tit="Click" Id="LABEL2"
::D.OGG D(Valore oggetto T1;P1;K1 = [T1];[P1];[K1])

Analizziamo la sintassi di scheda:

Definiamo come prima cosa la posizione e titolo della sezione. Subito dopo definiamo una sezione FLD con un campo di input Combo, definito nel ::G.SET con la sintassi Type=”Cmb“. Proseguendo nell’analisi vengono definiti due ::G.DIN che rappresentano i dinamismi utilizzati, in questo caso ne sono definiti due in modo da far vedere tutti e due i possibili dinamismi utilizzabili, il “change” e il “click” che scatteranno in due momenti differenti (come spiegato sopra). E in ultima posizione, non per importanza, ma per corretta sintassi, vediamo la FUN che lanciamo per valorizzare gli elementi della combo, in questo caso degli stati. In questo caso TAB£W00 (Livelli).

Nelle posizioni 2 e 3 vengono rappresentate le due label su cui hanno effetto i due dinamismi.

Note di utilizzo

  • Il componente Field funziona solo in Web.UP, in Looc.UP il componente non è implementato!
  • L’unico XML accettato da questo componente è quello di tipo albero (TRE).