Uno dei fattori che ha decretato il successo del Web è senz’altro la
possibilità di interagire: la possibilità cioè di iscriversi a servizi di vario
tipo (ad esempio mailing list), ma soprattutto di partecipare a vere e proprie
comunità virtuali, come il forum di
HTML.it.
Per organizzare questo genere di servizi è necessario raccogliere in qualche
modo i dati dell’utente: per farlo si utilizzano, in maniera molto semplice, i
moduli (cioè i form).
L’invio dei dati è solitamente organizzato in due parti:
- una pagina principale che contiene i vari campi dei form, che consentono
all’utente di effettuare delle scelte, scrivere del testo, inserire un’immagine
- una pagina secondaria che viene richiamata dalla principale e che effettua
"il lavoro" vero e proprio di processare e raccogliere i dati. Di norma si
tratta di una pagina di programmazione che si trova sul server. Può essere un
cgi, oppure una pagina asp, php, jsp o altro
Noi ci occuperemo della sola pagina principale, dal momento che il modo in
cui struttura una pagina di programmazione esula dagli obiettivi della presente
guida.
Name e action
Per creare una pagina con dei moduli, bisogna utilizzare l’apposito tag
<form>: si tratta di un elemento di blocco, come il
<p>, quindi il tag <form> lascia
uno spazio prima dell’apertura e dopo la chiusura.
<form name="datiUtenti"
action="paginaRisposta.php">
….
</form>
Nel caso in non si desideri avere dello spazio superfluo è possibile
modificare i bordi del tag utilizzando i fogli di stile. Con questa semplice
sintassi:
<form name="datiUtenti" style="border:0px"
action="paginaRisposta.php">
Come si può vedere, "name" serve per indicare il nome del
form, "action" indica l’URL del programma o della pagina di
risposta che processerà i dati.
Grazie all’"action" è anche possibile far sì che i dati
vengano inviati in e-mail al webmaster (si tratta infatti a tutti gli effetti di
un riferimento a un URL). Il codice è questo:
<form action="mailto:tuamail@nomeDominio.it?subject=Oggetto
predefinito"
enctype="text/plain" method="POST">
vedremo in una delle prossime lezioni come utilizzare concretamente questa
sintassi.
Method
Quando creiamo un form possiamo scegliere due metodi di invio: GET
e POST.
Con il metodo GET la pagina di risposta viene contattata e i
dati vengono inviati in un unico step.
Nell’URL della pagina di risposta
potremo allora vedere tutti i parametri nella barra degli indirizzi (più
precisamente nella "query string", cioè nella "stringa
di interrogazione") secondo questa forma:
http://www.html.it/esempioForm/paginaRisposta.php?nome=Wolfgang&cognome=Cecchin&datiInviati=prova+invio
i dati (nella forma nome del campo = valore del campo) sono
appesi alla pagina dopo il punto interrogativo.
Alcuni server hanno tuttavia
hanno delle limitazioni per quel che riguarda il metodo GET e
non consentono di inviare form con valori superiori a 255 caratteri
complessivi. Il metodo GET è dunque particolarmente
indicato per form con pochi campi e pochi dati da inviare. La sintassi per
l’invio in get è:
<form name="datiUtenti" action="paginaRisposta.php"
method="GET">
Nel metodo POST invece l’invio dei dati avviene in due step
distinti: prima viene contattata la pagina sul server che deve processare i
dati, e poi vengono inviati i dati stessi. Per questo motivo i parametri non
compaiono nella query string (dunque se non si desidera che i parametri siano
mostrati all’utente questo metodo è preferibile).
In questo caso non ci sono
limiti sulla lunghezza dei caratteri. La sintassi è:
<form name="datiUtenti" action="paginaRisposta.php"
method="POST">
Enctype (tipo di codifica)
Prima di passare i dati alla pagina di risposta, che si trova sul server,
questi vengono codificati dal browser in modo da non poter dare adito ad errori
(ad esempio gli spazi vengono convertiti in "+"). Normalmente non è necessario
specificare come si vuole effettuare la codifica dei dati, perché è sottinteso
l’invio di semplice testo. A volte però, come quando è necessario inviare
un’immagine, è tuttavia indispensabile dichiarare espressamente quali dati
vogliamo inviare. Per farlo è necessario utilizzare l’attributo
"enctype" ("encoding type", cioè "tipo
di codifica").
Come dicevamo normalmente non è necessario farlo, perché viene sottinteso
questo tipo di sintassi:
<form name="datiUtenti" action="paginaRisposta.php"
enctype="text/plain">
Ma nel caso di invio di immagini dovremo dichiarare:
<form name="datiUtenti" action="paginaRisposta.php"
method="post" enctype="multipart/form-data">
Target
Grazie all’attributo "target" è possibile far aprire i dati
del form in una pagina differente rispetto a quella corrente (o in una determinata parte di un
frameset):
<form name="datiUtenti" action="paginaRisposta.php"
method="get" target="_blank">