Applied Information Technology - V. Sviluppo di pagine web: Advanced HTML

4) Form

Form nella specifica di HTML4 del W3C

Guardate l'esempio sia con Explorer che con Netscape.

Esempio:

<FORM  METHOD="POST" TITLE="Form"
  ACTION="mailto:apweb@inwind.it ?subject=mail dal sito"
  enctype="text/plain"
  STYLE="background-color: #FFAA00">
<TABLE>
<TR><TD>
<INPUT TYPE="checkbox" NAME="CheckBox1"
	VALUE="c1" CHECKED>Check Box 1
</TD><TD>
<INPUT TYPE="checkbox" NAME="CheckBox2"
	VALUE="c2">Check Box 2
</TD>
<TR>
<TD>
<INPUT TYPE="radio" NAME="RadioButton"
	VALUE="r1" CHECKED>Radio Button 1
</TD>
<TD>
<INPUT TYPE="radio" NAME="RadioButton"
	VALUE="r2">Radio Button 2
</TD>
</TR>
<TR><TD>Text Area
	<TEXTAREA NAME="TextArea"
   ROWS="3" COLS="30"></TEXTAREA>
</TD></TR>
<TR><TD>Lista di Item:
  <SELECT NAME="ListBox" SIZE="1">
   <OPTION VALUE="1">Item1</OPTION>
   <OPTION VALUE="2">Item2</OPTION>
   <OPTION VALUE="3">Item3</OPTION>
  </SELECT>
</TD>
</TR>
<TR><TD>
<INPUT TYPE="reset" VALUE="ResetButton"
   STYLE="color: #000080; font-family: serif">
</TD><TD>
<INPUT TYPE="submit" NAME="SubmitButton"
   VALUE="Submit"
   STYLE="color: #000080;
         font-family: serif">
</TD></TR>
</TABLE>
</FORM>

Definizioni

<FORM>Contenuto della form</FORM>

Descrizione:	identifica il contenuto della form.
Tipo:	tag contenitore.
Attributi:	ACCEPT-CHARSET, ACTION, CLASS, DIR, ENCYTPE, ID, LANG, METHOD, NAME, STYLE, TARGET e TITLE.

<INPUT>

Descrizione:	crea un elemento di input all'interno della form.
Tipo:	tag vuoto.
Attributi:	ACCEPT, ACCESSKEY, ALIGN, ALT, BORDER, CHECKED, CLASS, DIR, DISABLED, ID, LANG, MAXLENGTH, NAME, READONLY, SIZE, SRC, STYLE, TABINDEX, TITLE, TYPE, USEMAP e VALUE.

<TEXTAREA>Area di testo</TEXTAREA>

Descrizione:	crea un'area di testo su più righe.
Tipo:	tag contenitore.
Attributi:	CLASS, COLS, DIR, DISABLED, ID, LANG, NAME, READONLY, ROWS, SRC, STYLE, TABINDEX, TITLE, TYPE e WRAP.

<SELECT>Insieme di opzioni</SELECT>

Descrizione:	crea un elenco di opzioni definite dal tag <OPTION>.
Tipo:	tag contenitore.
Attributi:	CLASS, COLS, DIR, DISABLED, ID, LANG, MULTIPLE, NAME, SIZE, STYLE, TABINDEX e TITLE.

<OPTION>Opzione di un menu</OPTION>

Descrizione:	crea le opzioni del menu creato con il tag <SELECT>.
Tipo:	tag contenitore.
Attributi:	CLASS, COLS, DIR, DISABLED, ID, LABEL, LANG, SELECTED, STYLE, TITLE e VALUE.
Nota:	deve essere specificato all'interno del tag <SELECT>.

Osservazioni

spesso le form fanno uso di speciali script cgi (Common Gateway Interface). Questi programmi girano sul server ed elaborano i dati contenuti nella form (ad esempio, vengono inseriti in un database o spediti via e-mail all'autore del sito o ad un indirizzo predefinito).
Ogni provider mette a disposizione alcuni script cgi di cui fornisce le istruzioni per utilizzarle (non è detto che le cgi di un provider siano uguali a quelle di un altro, controllate sempre le istruzioni allegate)
Questa la parte iniziale della form che genera il test che avete compilato all'inizio del corso:
```
<FORM ACTION="http://webtools.inwind.it/cgi/smtpmail.php" NAME="test"
METHOD="POST" ENCTYPE="text/plain">
```
il vantaggio di utilizzare una form cgi consiste nel permettere di compilare una form anche a chi non ha a disposizione un programma di posta elettronica; lo svantaggio è legato alla necessità di essere dipendenti dal server.
se volete fare spedire un file utlizzate
<INPUT TYPE="file" NAME="Attach">
e ricordatevi di specificare ENCTYPE="multipart/form-data" come atributo di <FORM>.

GuestBook

Di seguito sono riportate le istruzioni per utilizzare la cgi per il GuestBook di Inwind (disponibili in rete alla URL http://assistente.inwind.it/aiuto/spazioweb/guestbook.html).

Il guestbook permette agli utenti che accedono ad un sito di lasciare un messaggio, oltre al proprio indirizzo di posta ed al loro nome. È anche possibile visualizzare il guestbook senza aggiungere nessuna entry. I dati inseriti vengono memorizzati in un file di nome messages.txt presente nella propria directory principale.
Per inserire una entry nel proprio guestbook è sufficiente creare una form HTML come quella esemplificativa riportata sotto.
<FORM ACTION="http://webtools.inwind.it/cgi/guestbook.php"
  name="form1" METHOD="POST">
 <TABLE>
 <TR>
 <TD>Nome</TD>
 <TD><INPUT type="text" name="name"></TD>
 </TR>
 <TR>
 <TD>Email</TD>
 <TD><INPUT type="text" name="email"></TD>
 </TR>
 <TR>
 <TD>Commenti:</TD>
 <TD><TEXTAREA rows="6" cols="25"
                  name="comments"></TEXTAREA></TD>
 </TR>
 </TABLE>
 <INPUT type="hidden" name="user" value="apweb">
 <INPUT type="hidden" name="onsuccess_link"
     value="http://spazioweb.inwind.it/apweb">
 <INPUT type="hidden" name="onerror_link"
     value="http://spazioweb.inwind.it/apweb/">
 <INPUT type="submit" name="Sub" value="Invia">
 <INPUT type="reset" name="Res" value="Annulla">
</FORM>
Nome

Email

Commenti:
Questa è la tabella con la spiegazione di tutti i parametri:

Parametro Descrizione Tipo

user

Il parametro nascosto (HIDDEN) user ha come valore il proprio nome utente, col quale si accede ai servizi inwind.

Necessario

font_color Colore del testo del guestbook. Facoltativo

background_color Colore di sfondo della pagina del guestbook. Facoltativo

background_image Link all'eventuale immagine di sfondo della pagina del guestbook. Facoltativo

onerror_link Il valore di questo parametro rappresenta la pagina o il sito a cui saltare se l'inserimento dei dati nel guestbook non ha avuto esito positivo. Se esso non viene fornito, il browser visualizzerà un messaggio di errore.
Facoltativo

Per leggere il proprio guestbook basta inserire nella propria pagina un link all'apposito CGI.
<a href="http://webtools.inwind.it/cgi/readguestbook.php?user=apweb">
Leggi il guestbook</a>
Leggi il guestbook

[Precedente]

[Indice]

[Successiva]

Per informazioni apweb@inwind.it - Ultima modifica 04-Jun-2002