required: attributo HTML

L'attributo booleano required, se presente, indica che l'utente deve specificare un valore per l'input prima di poter inviare il modulo proprietario.

L'attributo required è supportato dagli input <input type="text">, <input type="search">, <input type="url">, <input type="tel">, <input type="email">, <input type="password">, <input type="date">, <input type="month">, <input type="week">, <input type="time">, <input type="datetime-local">, <input type="number">, <input type="checkbox">, <input type="radio">, <input type="file"> insieme agli elementi <select> e <textarea>. Se presente su uno qualsiasi di questi tipi ed elementi di input, la pseudo classe :required corrisponderà. Se l'attributo non è incluso, la pseudo classe :optional corrisponderà.

L'attributo non è supportato o rilevante per range e color , poiché entrambi hanno valori predefiniti. Inoltre, non è supportato su nascosto in quanto non ci si può aspettare che un utente compili un modulo nascosto. Né è supportato su nessuno dei tipi di pulsanti, incluso image.

Nel caso di un gruppo di pulsanti di opzione con lo stesso nome , se un singolo pulsante di opzione nel gruppo ha l'attributo required, è necessario selezionare un pulsante di opzione in quel gruppo, anche se non deve essere quello con l'attributo applicato. Quindi, per migliorare la manutenzione del codice, si consiglia di includere l'attributo required in ogni pulsante di opzione con lo stesso nome nel gruppo, oppure in nessuno.

Interazioni di attributi

Poiché un campo di sola lettura non può avere un valore, required non ha alcun effetto sugli input con l'attributo readonly anche specificato.

Usabilità

Quando si include l'attributo required, fornire un'indicazione visibile vicino al controllo per informare l'utente che <input>, <select> o <textarea> è richiesto. Inoltre, scegli come target i controlli dei moduli richiesti con la pseudo-classe :required, modellandoli in modo da indicare che sono obbligatori. Ciò migliora l'usabilità per gli utenti vedenti. La tecnologia assistiva dovrebbe informare l'utente che il controllo del modulo è obbligatorio in base all'attributo richiesto, ma l'aggiunta aria-required="true"non fa male, nel caso in cui la combinazione browser / screen reader non sia ancora supportata.

Convalida dei vincoli

Se l'elemento è richiesto e il valore dell'elemento è la stringa vuota, l'elemento soffre valueMissing e l'elemento corrisponderà alla pseudo classe :invalid.

Problemi di accessibilità

Fornire un'indicazione agli utenti informandoli che il controllo del modulo è obbligatorio. Assicurati che i messaggi siano sfaccettati, ad esempio attraverso testo, colore, contrassegni e attributi, in modo che tutti gli utenti comprendano i requisiti indipendentemente dal fatto che abbiano daltonismo, differenze cognitive o utilizzino un'utilità per la lettura dello schermo.