Form


Puoi chiedere informazioni ai visitatori della tua pagina usando il tag <FORM> (modulo). Per definire un FORM:

<FORM ACTION="qualcosa" METHOD="metodo"></FORM>

Ti occorre un programma per elaborare queste informazioni. Solitamente i server web usano una directory speciale chiamata 'CGI-BIN', dove sono situati questi programmi. Se non puoi accedere a questa directory, devi parlare col tuo amministratore del server. ACTION definisce l' URL dove e' situato il programma. In effetti e' piu' giusto parlare di 'script' piuttosto che di programma. Comunque puoi anche usare una action per spedire posta, e non hai nessun bisogno di accedere alla directory CGI-BIN per fare cio'. Devi solo inserire 'MAILTO:utente@dominio' nel campo ACTION. Per esempio: ACTION="MAILTO:mickey@mouse". METHOD puo' essere: GET o POST

  1. GET: i dati in input sono accodati all' URL specificato
  2. POST: i dati in input sono spediti separatamente

Dopo aver definito il form, devi definire i campi di INPUT:

<INPUT TYPE="tipo" NAME="qualcosa" SIZE="numero" VALUE="qualcosa">

Dove:

  1. TYPE: puo' essere TEXT, PASSWORD, HIDDEN, CHECKBOX, RADIO, IMAGE, SUBMIT, RESET
  2. NAME: qualsiasi nome che vuoi usare
  3. SIZE: la dimensione del campo
  4. VALUE: qualsiasi valore preimpostato che vuoi visualizzare
TEXT Definisce un campo di testo (default)
PASSWORD Quando l' utente digita qui, il testo non sara' mostrato
HIDDEN Questo e' un campo nascosto. Contiene il valore che specificato all' interno della pagina HTML
CHECKBOX Definisce una serie di campi che glu utenti possono 'spuntare'
RADIO Definisce una serie di campi mutualmente esclusivi
IMAGE Definisce una mappa cliccabile che sottomette il form
SUBMIT Definisce un bottone che sottomette il form
RESET Definisce un bottone che azzera i campi
  Align Checked Max length Name Size SRC Value
TEXT     O N O   O
PASSWORD     O N O   O
HIDDEN       N     O
CHECKBOX   O   N     N
RADIO   O   N     N
IMAGE O     N   N  
SUBMIT       O     O
RESET              
O=Opzionale N=Necessario

Ora vediamo un po' di esempi...

Esempio 1

Nome: Cognome:

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
Nome: <INPUT NAME="campo1" SIZE="10" TYPE="TEXT">
Cognome: <INPUT NAME="campo2" SIZE="10" TYPE="TEXT">
</INPUT>
</FORM>
</BODY>
</HTML>

Comunque questa form non fa nulla! Infatti non hai specificato il parametro ACTION...Per esempio:

<FORM ACTION="http://www.your_server/cgi-bin/your_program" METHOD="GET">

Esempio 2

Digita qualcosa qui:

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
Digita qualcos qui: <INPUT NAME="campo1" SIZE="10" TYPE="PASSWORD">
</FORM>
</BODY>
</HTML>

Esempio 3

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<INPUT NAME="f1" TYPE="CHECKBOX">
<INPUT NAME="f2" TYPE="CHECKBOX" CHECKED>
<INPUT NAME="f3" TYPE="CHECKBOX">
</FORM>
</BODY>
</HTML>

Osserva il terzo checkbox: puoi settare il valore CHEKED...

Esempio 4

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<INPUT NAME="f1" TYPE="RADIO">
<INPUT NAME="f1" TYPE="RADIO" CHECKED>
<INPUT NAME="f1" TYPE="RADIO">
</FORM>
</BODY>
</HTML>

Clicca sui campi radio sopra. Ricorda: il tipo RADIO significa 'mutualmente esclusivo', cosi' se clicchi su uno dei campi, quello sara' 'selezionato' ma gli altri non saranno selezionati...

Esempio 5

Questo e' un bottone SUBMIT. Puoi usare il tipo SUBMIT per sottomettere il form.

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<INPUT NAME="f1" TYPE="SUBMIT" VALUE="Submit">
</FORM>
</BODY>
</HTML>

Il tipo RESET e' come il tipo SUBMIT...Bene, ora vediamo il tag <TEXTAREA>:

<TEXTAREA NAME="qualcosa" ROWS="numero" COLS="numero"></TEXTAREA>

Tramite questo tag, puoi definire campi con piu' righe. ROWS e COLS definiscono le dimensioni del campo:

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<TEXTAREA NAME="f1" ROWS="2" COLS="20">
</TEXTAREA>
</FORM>
</BODY>
</HTML>

Ora vediamo il tag <SELECT>. Tramite questo tag, puoi definire una lista numerata di voci. Un menu pop-up per esempio:

<SELECT NAME="qualcosa" SIZE="numero" MULTIPLE></SELECT>

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<SELECT NAME="f1" SIZE="3">
<OPTION>Voce 1</OPTION>
<OPTION>Voce 2</OPTION>
<OPTION>Voce 3</OPTION>
<OPTION>Voce 4</OPTION>
<OPTION>Voce 5</OPTION>
<OPTION>Voce 6</OPTION>
</SELECT>
</FORM>
</BODY>
</HTML>

Come puoi vedere, c' e' un altro tag: <OPTION></OPTION>. Tramite questo tag puoi definire le voci:

<OPTION CHECKED VALUE="qualcosa"></OPTION>

Ora guarda questo esempio:

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<SELECT NAME="f1" SIZE="1">
<OPTION>Voce 1</OPTION>
<OPTION>Voce 2</OPTION>
<OPTION>Voce 3</OPTION>
<OPTION>Voce 4</OPTION>
<OPTION>Voce 5</OPTION>
<OPTION>Voce 6</OPTION>
</SELECT>
</FORM>
</BODY>
</HTML>

Questo e' un classico menu pop-up. Devi solo definire SIZE="1". Infine, guarda questo esempio:

Qui sono consentite selezioni MULTIPLE (premendo CTRL-click o SHIFT-click). Per fare cio' devi usare l' opzione MULTIPLE.

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<SELECT NAME="f1" SIZE="3" MULTIPLE>
<OPTION>Voce 1</OPTION>
<OPTION>Voce 2</OPTION>
<OPTION>Voce 3</OPTION>
<OPTION>Voce 4</OPTION>
<OPTION>Voce 5</OPTION>
<OPTION>Voce 6</OPTION>
</SELECT>
</FORM>
</BODY>
</HTML>

Se specifichi SELECTED, quella voce sara' selezionata:

In questo esempio infatti, la quarta voce e' selezionata.

E questo e' il sorgente HTML della pagina:

</HEAD>
<BODY>
<FORM METHOD="GET">
<SELECT NAME="f1" SIZE="3" MULTIPLE>
<OPTION>Voce 1</OPTION>
<OPTION>Voce 2</OPTION>
<OPTION>Voce 3</OPTION>
<OPTION SELECTED>Voce 4</OPTION>
<OPTION>Voce 5</OPTION>
<OPTION>Voce 6</OPTION>
</SELECT>
</FORM>
</BODY>
</HTML>


      Home  Pag. prec.  Pag. succ.       Chi siamo?  Scrivici!

Copyright © 1998-2005 Wowarea