pro-Gramas tu biblioteca de programacion
Tutoriales de Javascript
Introducción
Solo tienes que copear el código que esta abajo y si quieres puedes descargar el ejemplo funcionando al final.
<html>
<head>
<title>Validación campos de formulario</title>
</head>
<p align="center"><b>Validación campos de formulario
<script language="javascript">
function validacion(formulario) {
var er_nombre = /^([a-z]|[A-Z]|á|é|í|ó|ú|ñ|?|s|.|-)+$/ //letras, . y - o vacio
var er_telefono = /^([0-9s+-])+$/ //numeros, espacios, + o -
//fechas, formato dd/mm/aaaa o d/m/aa
var er_mes31dias = /^([1-3]0|[0-2][1-9]|31|[0-9])/(1|01|3|03|5|05|7|07|8|08|10|12)/
(1999|20[0-1][0-9]|2020)$/
var er_mes30dias = /^([1-3]0|[0-2][1-9]|[0-9])/(4|04|6|06|9|09|11)/(1999|20[0-1]
[0-9]|2020)$/
var er_mes28dias = /^([1-2]0|[0-2][1-8]|[0-1]9|[0-9])/(02|2)/(1999|200[1-3]|
200[5-7]|2009|201[0-1]|
201[3-5]|201[7-9])$/
var er_mes29dias = /^([1-2]0|[0-2][1-9]|[0-9])/(02|2)/(2000|2004|2008|2012|
2016|2020)$/
//direccion de correo electronico
var er_email = /^(.+@.+..+)$/
var x
//comprueba 50 caracteres maximo
for(x = 1; x < 5; x++) {
if (formulario.elements[x].value.length > 50) {
alert(La lontitud máxima permitida para cualquier campo es de 10 caracteres.)
return false
}
}
//comprueba campo de nombre
if(!er_nombre.test(formulario.nombre.value)) {
alert(Contenido del campo NOMBRE no válido.)
return false
}
//comprueba campos de telefonos (permite campos vacios y guiones)
if( !er_telefono.test(formulario.telefono.value) ) {
alert(Contenido del campo TELEFONO no válido.)
return false
}
//comprueba la fecha segun calendario (hasta el 2020, ojo)
if (!(er_mes31dias.test(formulario.fecha.value) ||
er_mes30dias.test(formulario.fecha.value) ||
er_mes29dias.test(formulario.fecha.value) ||
er_mes28dias.test(formulario.fecha.value))) {
alert(Contenido del campo FECHA no válido.)
return false
}
//comprueba campo de email
if(!er_email.test(formulario.email.value)) {
alert(Contenido del campo E-MAIL no válido.)
return false
}
alert(Los campos introducidos son CORRECTOS.)
return false //cambiar por return true para ejecutar la accion del formulario
}
</script>
<body>
<!-- Para visualizar el formulario -->
</b></p>
<form onsubmit="return validacion(this)" name="FormValidacion">
<p align="center"><small>Nombre:<br>
</small><input type="text" name="nombre" size="15"><br>
<small>Teléfono:<br>
</small><input type="text" name="telefono" size="15"><br>
<small>Fecha (dd/mm/aaaa):<br>
</small><input type="text" name="fecha" size="15"><br>
<small>Email:<br>
</small><input type="text" name="email" size="15"></p>
<p align="center"><input type="submit" value="Enviar" name="boton_envio">
<input type="reset" value="Borrar" name="boton_borrar"></p>
</form>
</body>
</html>Autor: S/A
Descargar
Descargar