Il tag Radio Button

Il Radio Button, o Option button, fornisce una opzione mutuamente esclusiva all’utente. Ovvero, al contrario del checkbox, non posso selezionare più di una opzione all’interno di una lista di scelte.

Si usa quindi quando dobbiamo far selezionare all’utente una unica scelta in una lista di possibili valori, per esempio la scelta della cittadinanza:

 

Italiana
Estera

 

 

o del sesso:

Maschio
Femmina

 

Se provate a selezionare l’opzione “maschio”, apparirà un pallino nero all’interno del bottone. Se successivamente selezionerete l’opzione “femmina”, verrà selezionata questa opzione e deselezionata in automatico la precedente.

Come si realizza un option button in HTML?

Per realizzare l’option button in HTML utilizziamo il tag RADIO, inserito nel tag FORM.

<input name=”cittadinanza” type=”radio” value=”italiana” /> Italiana<br />

<input name=”cittadinanza” type=”radio” value=”estera” /> Estera

Da notare che il name è uguale per entrambi gli oggetti. Se per errore metteste dei name diversi, non riuscireste a realizzare la mutua esclusione.

L’attributo importante del RADIO è checked, che può assumere i valori true o false. 

Se impostate il checked a true, di default l’opzione sarà selezionata.

<input name=”cittadinanza” type=”radio” value=”italiana”  checked=”true”/> Italiana<br />

<input name=”cittadinanza” type=”radio” value=”estera” /> Estera

 

  Italiana
Estera

Lascia un commento