<input type="checkbox">

Gli elementi <input> di tipo checkbox vengono visualizzati per impostazione predefinita come caselle che vengono selezionate (contrassegnate) quando attivate, come potresti vedere in un modulo cartaceo ufficiale del governo. L'aspetto esatto dipende dalla configurazione del sistema operativo in cui è in esecuzione il browser. Generalmente questo è un quadrato ma può avere angoli arrotondati. Una casella di controllo consente di selezionare singoli valori da inviare in un modulo (o meno).

Nota: i pulsanti di opzione sono simili alle caselle di controllo, ma con un'importante distinzione: i pulsanti di opzione sono raggruppati in un insieme in cui è possibile selezionare un solo pulsante di opzione alla volta, mentre le caselle di controllo consentono di attivare e disattivare singoli valori. Laddove esistono più controlli, i pulsanti di opzione consentono di selezionarne uno tra tutti, mentre le caselle di controllo consentono di selezionare più valori.

Valore

Una stringa che rappresenta il valore della casella di controllo. Questo non viene visualizzato sul lato client, ma sul server value è dato ai dati inviati con la casella di controllo name. Prendi il seguente esempio:

<form>
  <div>
    <input type="checkbox"subscribeNews" name="subscribe"
    value="newsletter">
    <label for="subscribeNews">Vuoi iscriverti alla newsletter?</label>
  </div>
  <div>
    <button type="submit">Iscriviti</button>
  </div>
</form>

In questo esempio, abbiamo un nome di subscribee un valore di newsletter. Quando il modulo viene inviato, la coppia nome/valore dati sarà subscribe=newsletter.

Se l'attributo value è stato omesso, il valore predefinito per la casella di controllo è on, quindi i dati inviati in quel caso sarebbero subscribe=on.

Attributi aggiuntivi

Oltre agli attributi comuni condivisi da tutti gli elementi <input>, gli input "checkbox" supportano i seguenti attributi.

checked

Un attributo booleano che indica se questa casella di controllo è selezionata o meno per impostazione predefinita (al caricamento della pagina). Non indica se questa casella di controllo è attualmente selezionata: se lo stato della casella di controllo viene modificato, questo attributo di contenuto non riflette la modifica.

value

L'attributo value è condiviso da tutti <input>; tuttavia, ha uno scopo speciale per input di tipo checkbox: quando viene inviato un modulo, solo le caselle di controllo attualmente selezionate vengono inviate al server e il valore riportato è il valore dell'attributo value. Se value non è altrimenti specificato, on è la stringa per impostazione predefinita.

Convalida

Le caselle di controllo supportano la convalida (offerta a tutti <input>). Tuttavia, la maggior parte delle ValidityStates sarà sempre false. Se la casella di controllo ha l'attributo required, ma non è selezionata, ValidityState.valueMissing sarà true.