Moduli interattivi
di GDesign, 27 Giugno 2002
Versione Stampabile
Download in pdf
Uno dei metodi fondamentali per interagire con gli utenti di un sito web è quello di porre domande e raccogliere delle risposte. Il linguaggio Html ci dà la possibilità di creare dei moduli interattivi che hanno come fine quello di interagire con gli utenti e raccogliere dati. Essenzialmente un modulo interattivo è un'insieme di testi e funzioni che consentono ai visitatori di compilare ed inviare dati al server o al gestore del sito. Per inserire un modulo in una pagina web, si usa la coppia di tag <FORM>......</FORM>; all'interno di questi tag, mediante l'uso di altri tag si impostano i vari dispositivi grafici per la raccolta dei dati. Tali dispositivi vengono anche definiti controlli e si dividono in due categorie fondamentali:quelli che funzionano con l'etichetta INPUT e quelli che hanno le proprie etichette. Vediamo allora quali sono i controlli di tipo INPUT:
<INPUT TYPE=text NAME=name>
la casella di testo è il campo di base per digitare una riga di testo.
<INPUT TYPE=password NAME=name>
la casella della password funziona allo stesso modo della casella di testo,
con la differenza che oscura la digitazione con dei caratteri asterisco.
<INPUT TYPE=checkbox NAME=name>
la casella di controllo viene usata per il tipo di dati si/no.
<INPUT TYPE=radio NAME=name VALUE=value>
pulsante d'opzione che si usa per l'immissione di dati a scelta multipla.
In una serie può essere attivato solo un pulsante alla volta.
<INPUT TYPE=submit NAME=name>
il pulsante di inoltro che consente di inviare il modulo.
<INPUT TYPE=reset NAME=name>
il pulsante reset ripristina il modulo sui valori predefiniti.
<INPUT TYPE=image NAME=name SRC=invia.gif>
anziché il pulsante di inoltro, si può usare un'immagine con
tutti i suoi attributi per inviare il modulo.
Vediamo adesso due controlli che hanno le proprie etichette:la casella di selezione e l'area di testo.
<SELECT>
<OPTION>Opzione 1
<OPTION>Opzione 2
<OPTION>Opzione 3
<OPTION>Opzione 4
</SELECT>
la casella di selezione è un tipo di controllo per l'immissione di
dati a scelta multipla. Questa casella si usa quando si hanno elenchi troppo
lunghi per i pulsanti d'opzione.
<TEXTAREA>Testo di default</TEXTAREA>
l'area di testo consente di digitare testi di una certa lunghezza.
Adesso che conosciamo i controlli maggiormente usati in un modulo interattivo, viene da chiedersi come fanno ad arrivarci i dati raccolti attraverso il modulo stesso. La risposta a questa domanda và oltre il campo dell'Html, in quanto i dati del modulo non vengono gestiti direttamente dalla pagina web ma vengono elaborati attraverso appositi script di tipo CGI (Common Gateway Interface) presenti sul server del sito. La gestione e la realizzazione di script CGI è un argomento abbastanza complesso, e non è necessario che, chiunque voglia realizzare un modulo interattivo per il proprio sito web, ne sia a conoscenza. Infatti, sui server dei siti web, si trovano spesso apposite funzioni CGI già configurate e funzionanti; è sufficiente quindi chiedere all'amministratore del server, sul quale avete il vostro sito web, quali sono gli script CGI installati e dove si trovano.
Supponiamo ad esempio, che l'amministratore del server abbia installato nella directory "cgi-bin" del nostro spazio web lo script "formail.pl" che ha il compito raccogliere i dati ed inviarceli via e-mail. Allora per creare il modulo interattivo scriveremo il seguente codice:
<FORM ACTION="http://www.nomesito.suffisso/cgi-bin/formail.pl" METHOD="post"> --controlli del modulo-- </FORM>
I due attributi ACTION e METHOD sono entrambi obbligatori. ACTION="destinazione" specifica la destinazione dei dati. METHOD="tipo di elaborazione" specifica il trattamento da effettuare ai dati e puo essere GET (i dati vengono elaborati subito e viene fornita in risposta una certa pagina Html) oppure POST (i dati vengono raccolti e trasmessi alla destinazione indicata).
Esistono anche modi alternativi di creare moduli interattivi senza ricorrere a script CGI. Ad esempio si può impostare un modulo in modo tale che quando l'utente fa clic sul pulsante di invio dati, questi vengano spediti all' indirizzo e-mail specificato. La sintassi è:
<FORM ACTION="mailto:email@dominio.it" METHOD="post"> --controlli del modulo-- </FORM>
L'uso di questo metodo presenta però uno svantaggio non trascurabile: solo i browser più recenti sono in grado di spedire dati ad indirizzi di posta elettronica. Di conseguenza, è preferibile scegliere l'alternativa dell'invio dati attraverso posta elettronica solo nel caso in cui non si ha alcuna possibilità di avere script CGI o non si hanno le conoscenze adatte per realizzarlo.
