L'attributo pattern

L'attributo pattern imposta la convalida di un campo di input di un modulo HTML tramite un'espressione regolare.

Le espressioni regolari sono comandi speciali che permettono di creare praticamente qualsiasi tipo di regola di convalida. Puoi approfondirle nel libro sulle espressioni regolari in PHP o nel libro sulle espressioni regolari in JavaScript.

Al tentativo di invio del modulo, nel caso in cui un campo con questo attributo non sia compilato correttamente, il browser impedirà l'invio del modulo e visualizzerà un errore sotto forma di suggerimento a comparsa. Sfortunatamente, il testo dell'errore e il suo aspetto non possono essere modificati utilizzando HTML o CSS.

Tieni presente che la presenza dell'attributo pattern non ti esonera dalla convalida della correttezza dei dati del modulo lato server con PHP (poiché è facile aggirare la protezione tramite l'attributo).

L'attributo pattern dovrebbe essere applicato ai tag input o textarea.

Esempio

Consideriamo il tag input e aggiungiamo l'attributo pattern, in cui inseriremo un'espressione regolare che verifichi che nell'input sia stato inserito un numero a due cifre (ad esempio, 25).

Inserisci un numero qualsiasi e prova a premere il pulsante per inviare il modulo. Se viene inserito un numero che non è a due cifre, il browser non permetterà l'invio del modulo e visualizzerà un messaggio di errore, altrimenti il modulo verrà inviato:

<form action="">
	<input type="text" pattern="\d{2}">
	<input type="submit">
</form>

Esempio . Campo vuoto

Nell'esempio precedente, il browser restituiva un errore solo nel caso in cui il campo non fosse vuoto (sebbene un campo vuoto non sia un numero a due cifre). Proviamo a fare in modo che l'errore venga visualizzato anche per un campo vuoto - insieme all'attributo pattern scriviamo anche l'attributo required:

<form action="">
	<input type="text" pattern="\d{2}" required>
	<input type="submit">
</form>

Vedi anche

l'attributo required,
che può essere utilizzato per effettuare la convalida del campo obbligatorio