Verificar si un dato es numérico

Una de las opciones más útiles que se puede desarrollar con JavaScript es la de la creación de controles de validación para los formularios, sin necesidad de crear y colocar en nuestro servidor un CGI. Estos controles pueden comprobar si el campo esta vacío o no, así como si su contenido es texto, números, direcciones de correo electrónico, etc.

Veamos algunos ejemplos:

La siguiente función permite verificar si lo que escribimos en el campo, en este caso "Edad", es numérico o no. En el caso de que no se un número, borrará el contenido y se colocará en el campo para volver a escribir.

function validar(form)
{
	valor = parseInt(form.edad.value, 10); //convierte cadenas de texto a
 números en el sistema numérico que le digamos
	if (isNaN(valor))    //el método "isNaN" comprueba si el valor No es un número
	{
		alert ("Edad incorrecta");
		form.edad.value=" ";  //borra lo escrito en el campo edad
		form.edad.focus();    //nos coloca en el campo edad para escribir
		return false;
	}
	else
		return true;
}

Verificar si un campo queda vacío

La siguiente función permite verificar si dejamos el campo (en este caso "nombre") vacío, en cuyo caso saldrá un mensaje alertando de que es obligatorio escribir algo y se posicionará en dicho campo.

function valido(form)
{
	if (form.nombre.value == "") //comprueba si el campo nombre esta vacío
	{
		alert ("No puedes dejarlo vacío");
		form.nombre.focus();   //posicionarse en el campo vacío
		return false;
	}
	else
		return true;
}

A continuación podemos ver un ejemplo donde se usan ambas funciones llamándolas a través del evento onClick colocado en el botón de envío del formulario. También las llamamos al salir de cada campo, a través del evento onBlur.

Verificar si varios campos quedan vacíos

La misma función pero con argumentos para poder verificar diversos campos y con mensajes personalizados para cada campo, podríamos hacerla de la siguiente manera:

function validar(campo)
{

hola=document.pepe.elements[campo]  //llamando pepe al formulario con el parámetro name
        if (hola.value == "")
        {
                alert ("No puedes dejar el campo "+hola.name+" vacío");
                hola.focus(); 
                return false;
        }
        else
                return true;
}

A continuación podemos ver un ejemplo donde se usan ésta función varias veces para validar varios campos a través del evento onClick colocado en el botón de envío del formulario.

<INPUT TYPE=SUBMIT VALUE=Enviar onClick="validar(2);validar(1);validar(0)">

Validador universal

Por último, un validador universal para poderlo usar en cualquier formulario simplemte teniendo cuidado de nombrar los campos usando las 2 primeras letras del nombre como se indica en el ejemplo.

Una pequeña calculadora

A través de javascript podemos hacer también diferentes cálculos. Estas funciones sirven para hacer las operaciones básicas con dos números introducidos a través de un formulario:

function Sumar(form)
{
var cifra1 = parseInt(form.caja1.value, 10);
var cifra2 = parseInt(form.caja2.value, 10);
form.resultado.value = (cifra1+cifra2);
return true
}

function Multiplicar(form)
{
var cifra1 = parseInt(form.caja1.value, 10);
var cifra2 = parseInt(form.caja2.value, 10);
form.resultado.value = (cifra1*cifra2);
return true
}

function Restar(form)
{
var cifra1 = parseInt(form.caja1.value, 10);
var cifra2 = parseInt(form.caja2.value, 10);
form.resultado.value = (cifra1-cifra2);
return true
}

function Dividir(form)
{
var cifra1 = parseInt(form.caja1.value, 10);
var cifra2 = parseInt(form.caja2.value, 10);
form.resultado.value = (cifra1/cifra2);
return true
}

A continuación podemos ver un ejemplo de una pequeña calculadora.