Manuale di HTML
I moduli
Informazioni aggiuntive
Il tag <INPUT> non è il solo utilizzato per reperire informazioni, ne esistono altri due, usati molto anch'essi. Sono i tag <TEXTAREA> e <SELECT>.
Il tag <TEXTAREA>..</TEXTAREA> si comporta come il tag <INPUT TYPE="text"> solo che il contenuto della casella può essere inserito su più righe. Come <INPUT> esso infatti rileva l'attributo NAME="nome" con cui associare il nome della variabile, mentre ignora gli attributi MAXLENGHT, SIZE e VALUE; è possibile però definire le dimensioni della casella mediante gli attributi cols="n" e rows="n" che indicano la larghezza in numero di caratteri e l'altezza in numero di righe.
Il tag <TEXTAREA> necessita del tag di chiusura </TEXTAREA> ed in mezzo ai due tag ci va l'eventuale testo che vorremmo inserire di default all'interno della casella; sarà l'utente a cancellarlo se vorrà cambiarlo. Non è possibile dare una formattazione al testo da inserire nell'area, e quindi non è possibile inserire del codice HTML tra questi due tag; tutto quello che sarà scritto nel documento HTML apparirà all'interno della casella.
Infine il tag <SELECT>..</SELECT>, che permette di inserire una casella di selezione a discesa. Una casella di selezione a discesa è una casella contenente alcune voci, visualizzate una sopra l'altra e tra le quali è possibile selezionarne una. Tra il tag di apertura e di chiusura vanno messe le varie opzioni selezionabili, mediante il tag <OPTION>.
<SELECT> ammette tre attributi, NAME="nome", SIZE="n" e MULTIPLE; l'attributo NAME serve per dare un nome alla variabile in questione, SIZE serve per indicare il numero di voci da visualizzare sullo schermo e infine MULTIPLE che se usato consente di selezionare più voci simultaneamente.
Il tag <OPTION>..</OPTION>, come appena specificato, è usato per indicare una ad una le varie opzioni della casella; esso riconosce 2 attributi, VALUE="testo" e SELECTED; il primo serve per indicare il valore che sarà passato al programma legato alla variabile "nome", mentre SELECTED, dove utilizzato, indica che quella voce è inizialmente selezionata per default; per evitare comportamenti imprevedibili da parte del browser è bene che questo attributo sia associato ad una sola opzione. Il testo compreso tra tag di apertura e di chiusura sarà quello che verrà visualizzato nella pagina web all'interno della casella.
Vediamo quindi un esempio di un modulo che utilizzi questi due tag appena introdotti. Come per il capitolo precedente il modulo è solo fittizio, non essendoci alcun programma in grado di ricevere i dati.
<HTML> <HEAD> <TITLE>Guida di HTML</TITLE> .... </HEAD> <BODY BGCOLOR="#FFEBCD"> <H2 ALIGN="center">Modulo 2</H2> <P>Seleziona un argomento e<BR> inserisci un breve commento.</P> Argomento : <SELECT NAME="argom" SIZE="3" ALIGN="middle"> <OPTION VALUE="sport">Sport</OPTION> <OPTION VALUE="arte" SELECTED>Arte</OPTION> <OPTION VALUE="econ">Economia</OPTION> <OPTION VALUE="cultura">Cultura</OPTION> <OPTION VALUE="storia">Storia</OPTION> <OPTION VALUE="tecno">Tecnologia</OPTION> </SELECT><BR> Commento:<BR> <TEXTAREA NAME="comment" ROWS="5" COLS="20"></TEXTAREA><BR> Giudizio : <SELECT NAME="giudizio"> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4" SELECTED>4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> </SELECT><BR> <INPUT TYPE="reset" VALUE="Annulla"> <INPUT TYPE="submit" VALUE="Invia"><BR> </FORM> </BODY> </HTML> |
Modulo 2 Seleziona un argomento e |
Con questo capitolo termina lo spazio dedicato alla costruzione dei moduli e all'HTML vero e proprio. Più avanti discuteremo dei linguaggi di programmazione e/o di scripting che ci permetteranno di creare i programmi che elaborino i dati raccolti mediante i moduli. Ricordiamo solamente che in internet numerosi siti mettono a disposizione migliaia di programmi già fatti e pronti per essere utilizzati all'interno di un sito web.