Attenzione!

Questo articolo contiene codice PHP e JavaScript ed è destinato agli sviluppatori. Offriamo questo codice per cortesia, ma non forniamo supporto per personalizzazioni del codice o sviluppo di terze parti.

Per ulteriore assistenza, consulta il tutorial di WPBeginner su come aggiungere codice personalizzato.

Chiudi

Come limitare i numeri in un campo modulo di testo a riga singola

Vuoi impedire agli utenti di inserire numeri nei tuoi campi di testo a riga singola? Sebbene tu possa utilizzare maschere di input per limitare i campi solo a caratteri alfabetici, questa guida ti mostrerà come creare una soluzione più flessibile che consenta sia lettere maiuscole che minuscole bloccando i numeri.

In questo tutorial, ti mostreremo lo snippet di codice necessario per limitare i numeri in questi campi.

Impostazione del modulo

Innanzitutto, crea un nuovo modulo e aggiungi un campo Testo a riga singola che desideri limitare. Per il nostro esempio, lo useremo come campo Nome utente. Se hai bisogno di aiuto per creare un modulo, consulta la nostra guida alla creazione del tuo primo modulo.

Prendi nota dell'ID del tuo modulo e dell'ID del campo poiché ti serviranno per il codice. Se non sei sicuro di come trovare questi ID, consulta la nostra guida su come trovare gli ID dei moduli e dei campi.

Aggiunta del codice di convalida

Questo codice impedirà l'invio del modulo se vengono rilevati numeri nel campo. Se hai bisogno di aiuto per aggiungere codice al tuo sito, consulta la nostra guida su come aggiungere codice personalizzato a un sito WordPress.

Sostituisci i seguenti valori nel codice PHP:

  • Alla riga 11: Sostituisci 1000 con l'ID del tuo modulo
  • Alla riga 17: Sostituisci 25 con l'ID del tuo campo
  • Alla riga 22: Sostituisci di nuovo 25 con l'ID del tuo campo

Se il campo Nome utente contiene numeri al momento dell'invio del modulo, apparirà un messaggio di errore e il modulo non verrà inviato.

ora puoi limitare i numeri in un campo modulo di testo a riga singola

Opzione di convalida in tempo reale

Se preferisci impedire agli utenti di inserire numeri prima dell'invio del modulo, puoi implementare la convalida in tempo reale. Ecco come:

Per iniziare, modifica il modulo e, con il campo Testo a riga singola selezionato, fai clic sulla scheda Avanzate in Opzioni campo e aggiungi no-numbers al campo Classi CSS.

Quindi, aggiungi questo codice JavaScript al tuo sito:

Una volta aggiunto lo snippet, verrà visualizzato immediatamente un messaggio di errore che avvisa il visitatore dell'errore di convalida quando esce dal campo (con Tab o clic).

Azione di riferimento

wpforms_process

Vuoi anche impedire l'inserimento di caratteri speciali in un campo modulo Testo a riga singola? Dai un'occhiata al tutorial su Come limitare i caratteri speciali da un campo modulo.