¡Atención!

Este artículo contiene código PHP y JavaScript y está destinado a desarrolladores. Ofrecemos este código como cortesía, pero no proporcionamos soporte para personalizaciones de código o desarrollo de terceros.

Para obtener ayuda adicional, consulta el tutorial de WPBeginner sobre cómo añadir código personalizado.

Descartar

Cómo restringir números en un campo de formulario de texto de una sola línea

¿Desea evitar que los usuarios introduzcan números en sus campos de Texto de una sola línea? Aunque puede utilizar máscaras de entrada para restringir los campos solo a caracteres alfabéticos, esta guía le mostrará cómo crear una solución más flexible que permita letras mayúsculas y minúsculas, al tiempo que bloquea los números.

En este tutorial, le mostraremos el fragmento de código necesario para restringir números en estos campos.

Configuración del formulario

Primero, cree un nuevo formulario y añada un campo de Texto de una sola línea que desee restringir. Para nuestro ejemplo, lo utilizaremos como campo de Nombre de usuario. Si necesita ayuda para crear un formulario, consulte nuestra guía para crear su primer formulario.

Tome nota del ID de su formulario y del ID de campo, ya que los necesitará para el código. Si no está seguro de cómo encontrar estos IDs, revise nuestra guía sobre cómo encontrar los IDs de formulario y campo.

Añadir el código de validación

Este código evitará el envío del formulario si se detectan números en el campo. Si necesita ayuda para añadir código a su sitio, consulte nuestra guía sobre cómo añadir código personalizado a un sitio de WordPress.

Reemplace los siguientes valores en el código PHP:

  • En la línea 11: Reemplace 1000 con el ID de su formulario
  • En la línea 17: Reemplace 25 con el ID de su campo
  • En la línea 22: Reemplace 25 con el ID de su campo de nuevo

Si el campo Nombre de usuario contiene algún número al enviar el formulario, aparecerá un mensaje de error y el formulario no se enviará.

ahora puede restringir números en un campo de formulario de texto de una sola línea

Opción de validación en tiempo real

Si prefiere evitar que los usuarios introduzcan números antes del envío del formulario, puede implementar la validación en tiempo real. Aquí le mostramos cómo:

Para empezar, edite el formulario y, con el campo Texto de una sola línea seleccionado, haga clic en la pestaña Avanzado en Opciones de campo y añada no-numbers al campo Clases CSS.

A continuación, añada este código JavaScript a su sitio:

Una vez añadido el fragmento, aparecerá un mensaje de error inmediato alertando al visitante del error de validación cuando salga del campo al tabular o hacer clic.

Acción de referencia

wpforms_process

¿Desea también evitar que se introduzcan caracteres especiales en un campo de formulario de Texto de una sola línea? Consulte el tutorial sobre Cómo restringir caracteres especiales de un campo de formulario.