HTML and CSS Reference
In-Depth Information
Esempio 3.1
<form>
<label>Inserisci il tuo nome:
<input name="name" />
</label>
</form>
Come si può notare, abbiamo impiegato tre tag:
form
: racchiude all'interno la form stessa;
label
: indica una descrizione associata al campo;
input
: consente l'inserimento di testo.
Particolarmente interessante è il tag
input
, che, attraverso la proprietà
type
, consente
di assegnare un comportamento visuale differente al tag stesso. Di default, questo valore è
impostato su
text
e avremo modo di analizzarne meglio le caratteristiche nel resto del ca-
pitolo. Possiamo specificare un valore predefinito, impostando la proprietà
value
, mentre
quella
name
è utilizzata, lato server, per ricavarne il rispettivo valore specificato nel brow-
ser. Così come per tutti i tag, poi, possiamo specificare una proprietà
id
, per l'interazione
con la parte di JavaScript.
Il tag
form
consente di aggiungere una proprietà
action
, che serve per specificare
la pagina a cui verrà inviato il contenuto della form, e una proprietà
method
, che invece
indica il
verb
dell'HTTP (
GET
o
POST
). Se queste proprietà vengono omesse, il contenuto
della form sarà inviato all'URL corrente attraverso il metodo
POST
. Il metodo
GET
è indi-
cato per URL rapidi e generalmente non è sfruttato con le form, perché prevede l'invio dei
dati in
querystring
(visibile nell'URL del browser) ed è limitato in quanto a dimensione.
Il metodo
POST
, viceversa, invia i dati all'interno del corpo della richiesta ed è, general-
mente, preferibile quando ci sono molte quantità di dati da inviare, oppure non si vuole
semplicemente sfruttare il metodo
GET
per questioni di opportunità.
Le caratteristiche analizzate finora ci consentono di costruire una semplice form, ma
come funziona l'invio dei dati al server?
Generalmente, una form è inviata sfruttando un pulsante, che nell'HTML corrisponde al
form che fa uso di questa funzionalità.
