Validar que el texto introducido en un formulario HTML es realmente un número es, quizas, el código JavaScript más utilizado a lo largo de la red. No en vano, si nos ponemos a pensar en el tipo de validaciones que se hacen dentro de un formulario, estas se limitaran a tamaños de cadenas, validaciones de número o, en los casos más avanzados, en patrones o expresiones regulares.
Y es que la potencia de detección de patrones en JavaScript puede ayudarnos a resolver cualquier validación que queramos hacer en un formulario HTML. Como veremos más adelante en el caso que nos compete.
Para empezar tenemos un formulario HTML simple, en el cual incluiremos un campo de texto mediante una etiqueta <INPUT>.
<FORM id="formularioCantidad">
Cantidad: <INPUT type="text" SIZE=10 id="cantidad">
</FORM>
La idea es que cuando la persona teclee algo sobre este campo y se vaya a otro realicemos la validación sobre si es o no un número.
A si que lo primero que tenemos que hacer es controlar el evento onChange el cual nos indicará que el contenido del campo ha cambiado con respecto al anterior ha cambiado y nos hemos ido a otro elemento de la página. Y asociaremos a este evento la función de validación.
Quedándonos la siguiente línea de código:
<INPUT type="text" SIZE=10 id="cantidad" onChange="validarSiNumero(this.value);">
Como podemos ver, la función está recibiendo como parámetro el valor que haya en el campo del formulario. Si bien, podemos utilizar cualquier otro evento que nos pueda venir bien.
Ahora solo nos quedará codificar la función JavaScript que valide si lo recibido es un número. Como hemos dicho al principio, nos vamos a basar en patrones. Es decir, la idea es validar que los caracteres pasados son números y tendremos que compararlo contra un patrón que signifique eso.
Los patrones en JavaScript son expresiones regulares. Una expresión regular se define de la siguiente forma:
/^ expr regular $/
Es decir, siempre empieza por “/^” y acaba por $/.
Si con una empresión regular queremos validar que un caracter sa un número utilizaremos el rango [0-9], quedándonos la expresión de la siguiente forma:
/^[0-9]$/
Si queremos indicar que van a ser un conjunto de caracteres deberemos de utlizar un operador de cardinalidad. En este caso deberemos de utilizar el * para indicar que serán n caracteres. Ahora, nos quedará de la siguiente forma:
/^([0-9])*$/
Usuarios que han visto este tema también han visto...
- Barra de cargando página en JavaScript
- De decimales a Hexadecimales y viceversa en JavaScript
- Comprobación del Referer con JavaScript
- Texto según la hora del día en Javascript
- Confirmar acción con JavaScript
- Versión imprimible de este documento
- Enviar por e-mail este documentoInformación legal | Política de Privacidad | Contacte con nosotros
Otro proyecto de Factoría de Internet. Copyright© 2003-2008 Factoría de Internet S.L.. Todos los derechos reservados.