HTML: Introduzione
I FORM
I “form” sono moduli che raccolgono tutti i dati utente. Quando vi registrate ad un sito,
oppure vi iscrivete ad un forum di discussione, o semplicemente effettuate il login alla
vostra webmail, state utilizzando un modulo di raccolta dati.
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 sitratta 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.
1
Lezione 3
HTML: Introduzione
I tag <form>
Il tag per creare moduli è il tag <form>.
Indispensabili attributi per il tag form sono l’attributo “name” e “action”.
L’attributo name specifica il nome del modulo. E’ indispensabile perché se ci sono più
moduli nella pagina web bisogna identificarli univocamente.
L’attributo action specifica invece la pagina secondaria (o il link alla pagina secondaria)
che si occuperà della raccolta dati.
2
Lezione 3
HTML: Introduzione
Method, enctype e target
Altri attributi dei form sono riassunti nella seguente tabella. Verranno approfonditi nelle prossime
lezioni.
3
Attributo
Valori
Method
Get: la pagina di risposta viene contattata e idati vengono inviati in un unico step
Nel metodo POST invece l'invio dei dati avviene in due stepdistinti: prima viene contattata la pagina sul server
che deve processare i dati, e poi vengono inviati i dati stessi. Per questo motivo i parametri noncompaiono nella
query string (dunque se non si desidera che i parametri siano mostrati all'utente questo metodo è preferibile)
Enctype
Assume valori diversi a seconda che il tipo di dati sia testo, immagini… Normalmente non è necessario specificare
come si vuole effettuare la codifica dei dati, perché è sottinteso l'invio di semplice testo
Target
Valgono le stesse considerazioni fatte quando abbiamo trattato i frame.
Lezione 3
HTML: Introduzione
Esempi
Esempio 1:
<form name="datiUtenti“ action="paginaRisposta.php">...
</form>
Esempio 2:
<form action=“paginaRisposta.php?nome=valore" enctype="text/plain" method="POST"> ...
</form>
Esempio 3:
<form name="datiUtenti" action="paginaRisposta.php“ enctype="text/plain"> ...
</form>
Esempio 4:
<form name="datiUtenti" action="paginaRisposta.php" method="get" target="_blank"> ...
</form>
4
Lezione 3
HTML: Introduzione
Il tag <input>
Per quel che riguarda i campi dei form il tag più utilizzato è l'<input>, che è senza
chiusura. Per specificare undeterminato tipo di campo è sufficiente indicare il tipo di input.
La tabella riassume i vari tipi di input:
5
Tipo
Descrizione
Text
Campo di tipo testo
Button
Campo di tipo bottone
Submit
Bottone di invio
Reset
Bottone per la “pulizia” del
form
Lezione 3