simply4you.it simply4you.it

   Home
     Articoli, Tutorial...
       Linguaggi WEB
         Corso di HTML
Lezione 1
Lezione 2
Lezione 3
Lezione 4
Lezione 5
Lezione 6
Lezione 7



Autore
Pierluigi

E-Mail
peppo2@hotmail.com

Sito



Commenta anche tu !  


LINK ASP/HTML
LINK Java/JavaScript















   Invia il link di questo articolo ad un amico  Invia ad un amico Visualizza la versione stampabile di questo articolo  Stampa Commenta questo Articolo  Commenta Parlane in Chat  Chat   Parlane sul Forum  Forum

Corso di HTML (Le Forms)

<FORM>...</FORM>
Questo tag permette di gestire l'input remoto di un utente verso il server. L'utente ha di fronte a se la scheda (FORM) e vi può inserire informazioni come testo o scelte obbligate. Una volta riempiti tutti i campi l'utente sottomette (SUBMIT) i dati al server con il metodo indicato e il server li elabora scatenando le reazioni connesse. Gli attributi possibili sono:

ACTION="url" specifica l'url del programma eseguito al momento della sottomissione della form al server. La url più utilizzata è "mailto:Email", che sottomette all'indirizzo di posta elettronica specificato i contenuti dei campi, separando i campi con il segno & e le parole all'interno di un campo con il segno + (non possono essere inviati spazi bianchi). La forma è quindi la seguente: nomecampo1=testo1+testo11&...&nomecampoN=testoN.

METHOD="get|post" stabilisce il metodo usato per inviare al server le informazioni. Il valore di default è GET che appende i dati di seguito all'indirizzo dell'ACTION generando così problemi di troncamento. E' quindi consigliabile utilizzare il metodo POST che non soffre di questo problema in quanto spedisce i dati come sequenza separata.

TARGET="nome" stabilisce in quale finestra debba essere caricato il risultato del puntamento. Può assumere valori speciali, (_blank, _parent...)

ENCTYPE="tipo_codifica" serve a specificare il tipo di codifica utilizzato, i nuovi browser ne faranno uso.


<INPUT>...</INPUT>
Specifica un bottone o un area che permettono di inviare dati al server. Gli attributi possibili sono:

ALIGN="top|middle|bottom|left|right" specifica l'allineamento rispetto al testo circostante nel caso che TYPE=IMAGE.

CHECKED questo attributo viene utilizzato in un radio o in un CHECKBOX per attuare una preselezione di default al momento della creazione della scheda.

MAXLENGHT=# stabilisce il numero massimo di caratteri che possono essere digitati in un input testuale.

NAME="nome" stabilisce il nome del bottone o dell'area di testo.

SIZE=# stabilisce la dimensione del campo di input.

SRC="url" stabilisce il percorso dove si trova il file nel caso che TYPE=IMAGE.

VALUE="valore" con questo attributo è possibile stabilire il valore iniziale di un campo. Nel caso di un'area di testo definisce la stringa visualizzata in dafault. Nel caso di un bottone come SUBMIT o RESET definisce la scritta che compare sullo stesso.

TYPE="tipo" stabilisce il tipo di campo che si vuole definire. Può assumere i seguenti valori dai quali dipenderanno le presenze o meno di certi attributi nel tag INPUT:

TEXT tipo in default, definisce un campo contenente testo (Attributi obbligatori: NAME. Attributi opzionali: MAXLENGHT, SIZE, VALUE).

PASSWORD definisce un campo che non mostra la sua scrittura. Attenzione però, perchè la trasmissione in rete avverrà poi in chiaro (Attributi obbligatori: NAME. Attributi opzionali: MAXLENGHT, SIZE, VALUE).

HIDDEN definisce un campo nascosto di valore prefisato nel sorgente HTML (Attributi obbligatori: NAME. Attributi opzionali: VALUE).

CHECKBOX definisce un campo come un insieme di campi selezionabili (Attributi obbligatori: NAME, VALUE. Attributi opzionali: CHECKED).

RADIO definisce un campo come un insieme di campi selezionabili ma mutuamente esclusivi (Attributi obbligatori: NAME, VALUE. Attributi opzionali: CHECKED).

IMAGE definisce un'immagine che se cliccata sottomette la form con le coordinate di dove è avvenuto il clic del mouse (Attributi obbligatori: NAME, SRC. Attributi opzionali: ALIGN).

SUBMIT crea il bottone, che una volta premuto, sottomette i dati della form al server (Attributi opzionali: NAME, VALUE).

RESET crea il bottone che una volta premuto, ripristina i campi con i loro valori iniziali.

<TEXTAREA>...</TEXTAREA>
Permette la creazione di un'area di testo di più righe per l'inserimento di dati da parte dell'utente. Tutto ciò che è contenuto fra il tag di apertura e quello di chiusura viene visualizzato nell'area come testo di default. Gli attributi possibilli sono:

COLS=# stabilisce la larghezza come numero di colonne dell'area di testo.

ROWS=# stabilisce l'altezza come numero di righe dell'area di testo.

NAME="nome" definisce il nome dell'area di testo per il programma che elaborerà la scheda.

WRAP="..." specifica come verrà mascherato il testo. Possibili valori sono "HARD", "SOFT", "NONE".

<SELECT>...</SELECT>
Questo tag permette di creare di creare un menu di tipo pop-down di valori selezionabili definiti con i tag OPTION. Gli attributi possibili sono:

MULTIPLE stabilisce che è consentito operare più di una selezione contemporaneamente.

NAME="nome" stabilisce il nome del menu utilizzato poi dal programma che elaborerà la scheda.

SIZE=# stabilisce quanti elementi saranno visibili contemporaneamente nel menu. In pratica limita le dimensioni della lista inserendo una eventuale barra di scorrimento.

<OPTION>...<OPTION>
Questo tag può apparire solo all'interno di SELECT di cui ne rappresenta una scelta. Gli attributi possibili sono:

VALUE="valore" stabilisce il valore che deve essere ritornato all'atto della sottomissione della scheda per quella eventuale selezione.

SELECTED definisce l'opzione inizialmente selezionata.

Nuovi elementi per i Forms HTML 4.0
FIELDSET e LEGEND
LEGEND rappresenta il titolo (o intestazione) di una pagina e FIELDSET identifica uno specifico argomento all'interno. Esempi:

<FORM action="..." method="post">
<FIELDSET>
<LEGEND align="top">Rubrica</LEGEND>
Cognome:<INPUT name="cgn" type="text" tabindex="1">
Nome:<INPUT name="nom" type="text" tabindex="2">
Telefono:<INPUT name="tel" type="text" tabindex="3">
</FIELDSET>
<FIELDSET>
<LEGEND align="top">Frutta di stagione</LEGEND>
<INPUT name="fr_stg" type="checkbox" value="cocomeri" tabindex="20">Cocomeri</INPUT>
<INPUT name="fr_stg" type="checkbox" value="meloni" tabindex="21">Meloni</INPUT>
<INPUT name="fr_stg" type="checkbox" value="pesche" tabindex="22">Pesche</INPUT>
<INPUT name="fr_stg" type="checkbox" value="albicocche" tabindex="23">Albicocche</INPUT>
</FIELDSET>


BUTTON
Questo nuovo tag permette di inviare i dati di una form ad un server. Si tratta di un elemento più versatile di INPUT perché permette l'utilizzo di una immagine al posto del bottone. E' simile al tag INPUT TYPE=image che suggeriamo di inserire per coloro che non fossero in grado di visualizzare il nuovo elemento. Riportiamo un esempio in cui questo nuovo tag all'interno di una form.

<FORM action"url" method="post">
<P>
Nome:<INPUT type="text" name="nom"><BR>
Cognome:<INPUT type="text" name="cgn"><BR>
Telefono:<INPUT type="text" name="tel"><BR>
<INPUT type="radio" name="sesso" value="Maschio">Maschio<BR>
<INPUT type="radio" name="sesso" value="Femmina">Femmina<BR>
<BUTTON name="submit" value="submit" type="submit">Invia<IMG src="url" alt="clicca"></BUTTON>
<BUTTON name="reset" type="reset">Annulla<IMG src="url" alt="pulisci"></BUTTON>
</FORM>



   Invia il link di questo articolo ad un amico  Invia ad un amico Visualizza la versione stampabile di questo articolo  Stampa Commenta questo Articolo  Commenta Parlane in Chat  Chat   Parlane sul Forum  Forum