HTML - L'etichetta checkbox

  »   HTML  »   HTML Tutorial - Using Checkbox Tag

Le caselle di controllo (in inglese 'checkbox'), come abbiamo detto in un precedente tutorial, fanno parte delle applicazioni che l'etichetta input offre.

La differenza rispetto al tutorial precedente è che questa volta esamineremo più approfonditamente l'argomento.

Checkbox - Creare la lista

L'attributo checkbox viene utilizzato per permettere all'utente di selezionare più di un'opzione della lista.

html<p>Scegli il tuo colore preferito .</p>
<p>
	Blu: <input type="checkbox" name="colors" value="blue" /><br />
	Giallo: <input type="checkbox" name="colors" value="yellow" /><br />
	Rosso: <input type="checkbox" name="colors" value="red" /><br />
	Verde: <input type="checkbox" name="colors" value="green" />
</p>

Demo

Scegli il tuo colore preferito .

Blu:
Giallo:
Rosso:
Verde:

Checkbox - Valori di default

Quest'attributo permette di selezionare alcuni campi di una lista di default. Questo si può rivelare molto utile in alcuni casi.

Questa cosa viene fatta con l'aiuto dell'attributo checked, impostando il suo valore a yes, come nell'esempio seguente:

html<p>Choose your favorite colors .</p>
<p>Scegli il tuo colore preferito .</p>
<p>
	Blu: <input type="checkbox" name="colors" value="blue" checked="yes" /><br />
	Giallo: <input type="checkbox" name="colors" value="yellow" /><br />
	Rosso: <input type="checkbox" name="colors" value="red" /><br />
	Verde: <input type="checkbox" name="colors" value="green" checked="yes" />
</p>

Demo

Choose your favorite colors .

Scegli il tuo colore preferito .

Blu:
Giallo:
Rosso:
Verde:

Si può provare a giocare un po' con quest'etichetta. E' abbastanza semplice ma, come si vedrà, molto utile.