Validación de un formulario con Javascript

Muy bueno tu articulo Miguel.
yo necesitaba algo muy parecido y me di cuenta de un pequeño detalle que pasa si lleno la caja de texto NOMBRE con puros espacios en blancos.
Veo que no has validado eso. Yo tambien tenia ese pequeño problemilla y lo soluciones agrgando un par de funciones que de hecho las encontre en internet.
function Trim( str ) {
var resultStr = "";
resultStr = TrimLeft(str);
resultStr = TrimRight(resultStr);
return resultStr;
}

function TrimLeft( str ) {
var resultStr = "";
var i = len = 0;
if (str+"" == "undefined" || str == null)
return "";
str += "";

if (str.length == 0)
resultStr = "";
else {
len = str.length;
while ((i <= len) && (str.charAt(i) == " "))
i++;
resultStr = str.substring(i, len);
}
return resultStr;
}

function TrimRight( str ) {
var resultStr = "";
var i = 0;
if (str+"" == "undefined" || str == null)
return "";
str += "";
if (str.length == 0)
resultStr = "";
else {
i = str.length - 1;
while ((i >= 0) && (str.charAt(i) == " "))
i--;
resultStr = str.substring(0, i + 1);
}

return resultStr;
}

----------------
Como ven la funcion TRim quita los espacios en blancos que existan a los costados de una cadena y para ello se vale de dos funciones TrimRight y TrimLeft que quitan espacios a la derecha e izquierda de la cadena respectivamente.

Luego puedes agragarle a tu funcion de validacion algo como lo siguiente:

function valida_envia(){
...
...
...
nom = document.Formulario.nombre.value;
if ( Trim(nom)=="" ){
alert ("Por favor ingrese su nombre correctamente");
return;
}

.....
.....
}

-----
Espero que les sea de ayuda.
Y espero sigas enviando articulos. Esto de compartir conocimientos es muy bueno.
Bueno adios y gracias fue de mucha tu articulo.

Probé hacer un script muy similar al que muestran aquí, pero el problema es que luego de mostrar el error, el formulario se seguía enviando con los errores.

Para solucionarlo cambie los "return 0" por "return false" y luego llame a la función de la siguiente manera:

<form name="form1" action="contacto.php" method="post" onSubmit="javascript:return validar();">

Saludos

VALIDACION DE FECHA Y FORMATO

<SCRIPT LANGUAGE="JavaScript">
function Validar(Form)
{ var bisiesto_ini=0;var bisiesto_fin=0;var fecha=new Date();var anyo=0;
var diainicio=0;var mesinicio=0;var anyoinicio=0;var error=0;var campos=0
var diafin=0;var mesfin=0;var anyofin=0;var mayor=0;var mensaje='';
var barra1ini='';barra2ini='';var barra1fin='';barra2fin='';

barra1fin=Form.fechafin.value.substr(2,1);
barra2fin=Form.fechafin.value.substr(5,1);
barra1ini=Form.fechainicio.value.substr(2,1);
barra2ini=Form.fechainicio.value.substr(5,1);
diainicio=Form.fechainicio.value.substr(0,2);
mesinicio=Form.fechainicio.value.substr(3,2);
anyoinicio=Form.fechainicio.value.substr(6,4);
diafin=Form.fechafin.value.substr(0,2);
mesfin=Form.fechafin.value.substr(3,2);
anyofin=Form.fechafin.value.substr(6,4);

bisiesto_fin=anyofin%4;bisiesto_ini=anyoinicio%4;
anyo=fecha.getYear(); mes=fecha.getMonth()+1; dia=fecha.getDate();

/*control formato*/

if (Form.fechainicio.length<10 || barra1ini!='/' || barra1ini!='-')
{alert("RELLENE LA FECHA INICIO CON EL FORMATO ESPECIFICADO");
Form.fechainicio.focus();Form.fechainicio.value='';return false;}

if (Form.fechainicio.length<10 || barra1ini!='/' || barra1ini!='-')
{alert("RELLENE LA FECHA FIN CON EL FORMATO ESPECIFICADO");
Form.fechafin.focus();Form.fechafin.value='';return false;}
/*fin control formato*/

/*control si la fecha inicial es mayor a la inicial*/
if (anyofin<anyoinicio){mayor=1;}
if (mesfin<mesinicio && anyofin==anyoinicio){mayor=1;}
if (diafin<diainicio && mesfin==mesinicio && anyofin==anyoinicio){mayor=1;}
if (mayor==1)
{error=1;mensaje='LA FECHA INICIAL NO PUEDE SER MENOR QUE LA FINAL';}
/*Fin control si la fecha inicial es mayor a la inicial*/

/*control de meses que tienen 31 dias*/
if (diainicio==31 && (mesinicio==2 || mesinicio==4 || mesinicio==6 || mesinicio==9 || mesinicio==11) )
{error=1;campos=1;
mensaje='MES CON MENOS DE 31 DIAS EN FECHA INICIAL';}
/*fin control de meses que tienen 31 dias*/

/*año bisiesto*/
if((diainicio>28 && mesinicio==2 && bisiesto_ini!=0) || (diafin>28 && mesfin==2 && bisiesto_fin!=0))
{mensaje='FECHA NO BISIESTA';
if (mesinicio==2){campos=1;}
if (mesfin==2){campos=2;}
error=1;}
/*fin año bisiesto*/
/*control de meses que tienen 31 dias*/
if (diafin==31 && (mesfin==2 || mesfin==4 || mesfin==6 || mesfin==9 || mesfin==11) || (diafin>28 && bisiesto==0))
{error=1;campos=2;
mensaje='MES CON MENOS DE 31 DIAS EN FECHA FINAL';}
/*fin control de meses que tienen 31 dias*/

/*fecha mayor a la actual*/
if(anyoinicio>anyo || anyofin >anyo || diainicio >31 || diafin>31 || mesinicio>12 || mesinicio >12)
{error=1;mensaje='FECHA MAYOR A LA ACTUAL';campos=0;}
/*fin fecha mayor a la actual*/

/*muestra errores*/
if (error==1)
{ switch (campos){
case 0:
Form.fechainicio.focus();
Form.fechainicio.value='';
Form.fechafin.value='';
break;
case 1:
Form.fechainicio.focus();
Form.fechainicio.value='';
break;
case 2:
Form.fechafin.focus();
Form.fechafin.value='';
break;}
alert(mensaje);
return false;}
else {return true;}
}
</SCRIPT>

hola, esto es algo parecido, pero en vez de mostrar un pop up, avisa al lado que se debe completar el campo. Salu2

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Validaciones</title>
</head>

<body>

<script language=javascript>



function validarFormulario(){

var isNotOk;

//validación nombre

var nombre = window.document.formValidar.nombre.value;
if (nombre==""){

document.getElementById("name").style.display="inline";
//window.document.formValidar.nombre.focus();
//return 0;
isNotOk=true;

}
else{

document.getElementById("name").style.display="none";

}

//validación apellido

var apellido = window.document.formValidar.apellido.value;
if (apellido==""){

document.getElementById("lastName").style.display="inline";
//window.document.formValidar.apellido.focus();
//return 0;
isNotOk=true;
}
else{

document.getElementById("lastName").style.display="none";
}

//validación calle

var calle = window.document.formValidar.calle.value;
if (calle==""){

document.getElementById("street").style.display="inline";
//window.document.formValidar.calle.focus();
//return 0;
isNotOk=true;
}
else{

document.getElementById("street").style.display="none";
}


//validación nro de calle
var numero;
numero= window.document.formValidar.numero.value;
if (isNaN(numero) || (numero=="")){

document.getElementById("number").style.display="inline";

//window.document.formValidar.numero.focus();
//return 0;
isNotOk=true;

}
else{

document.getElementById("number").style.display="none";
}


if (isNotOk){
return 0;


}
else{
window.document.formValidar.submit();
}



}
</script>

<form name="formValidar" >

<table>

<tr>
<td>Nombre:</td>
<td>
<input type=text name="nombre" maxlength=20></td>
<td>
<div id="name" style="display:none; color:red">&nbsp;Nombre inválido</div>
</td>
</tr>
<tr>
<td>Apellido:</td>
<td>
<input type=text name="apellido" maxlength=20></td>
<td>

<div id="lastName" style="display:none; color:red">&nbsp;Apellido inválido</div>

</td>

</tr>
<tr>
<td>Calle:</td>
<td>
<input type=text name="calle" maxlength=20></td>
<td>

<div id="street" style="display:none; color:red">&nbsp;Calle inválida</div>

</td>


</tr>

<tr>
<td>Número:</td>
<td>
<input type=text name="numero" maxlength=5 ></td>
<td>

<div id="number" style="display:none; color:red">&nbsp;Número inválido</div>

</td>



</tr>

<tr><td>
<input type=button value=Enviar onclick="validarFormulario()">
</tr></td>


</table>

</form>
</body>
</html>

El script es muy util pero si tiene errores ya que despues de mandar el mensaje de error se envia la pagina a su destino, esto debido a que en el form action="" es la siguiente página donde ira esta información del formulario. seria interesante poner esta validacion precisamente con el action.

Saludos

en la funcion para validar el nombre hace falta el paréntesis que contiene todo el codigo.

function valida_envia(){
//valido el nombre
if (document.fvalida.nombre.value.length==0){
alert("Tiene que escribir su nombre")
document.fvalida.nombre.focus()
return 0;
}
} <---- si no la funcion no hara nada

seguramente muchos lo habran notado pero es importante hacerlo ver dado que mucha gente es principiante (yo mismo empece a programar gracias a este sitio)
Saludos :D

como puedo validar un radio button ??

hola yo necesito validar que solo admita 20 numeros pero no tengo ni idea como hacerlo. tengo esta funcion y me gustaria agregarle esa validacion.
function validar1(e){
tecla_codigo = (document.all) ? e.keyCode : e.which;
patron =/[0-9]/;
tecla_valor1 = String.fromCharCode(tecla_codigo);
return patron.test(tecla_valor1);
}
garcias

pero si estoy usando una base de datos como puedo hacer para que cuando la clave que envio no existe en ella me envie un error y retorne al formulario?

hola, tengo un problema sabes que necesito un formulario en javascript validado, ya que de eso dependo pasar la materia gracias lo necesito urgente por favor

Excelente tu posto sobre validacion de formualrios medio una gran idea de como validar con javascript, solamente un pequeño comentario.

cuando utilizas edad = validarEntero(edad)

Realmente no funcion a a menos que tambien hallas cargado el script que mencionas en tu documentacion.

sugiero hacer la validacion directamente en el script que escrbiste cambiando esa linea por:
edad = parseInt(edad)

Con eso ya se validaria en el mismo script que la edad sea un entero

Que tal,

Se debe considerar que el campo no quede con el espacio en blanco, si doy un espacio en blanco sin agregar nombre alguno, me acepta la validación del nombre, para ello es bueno usar expresiones regulares.

Saludos.

Hola. Estoy comenzando a comprender o tratando de hacerlo en realidad, la programacion de formularios con Javascript. Por ello pregunto ¿por cual funcion se cambiaria la funcion de validar la edad, que si bien tiene dos partes se podria reducir a una, por la funcion de validar email y como sería esta funcion? Muy agradecido desde ya.

si quieres ayudar hazlo bien...!
te falta funcion validarEntero() en el ejemplo..
gracias

hola....
estoy haciendo un formulario,,, necesito crear un pdf con numero cedula, nombre y un pin,,,,, como hago para realizar este pdf desde dreamwaver con los datos que se han insertado en el formulario....

Agradezco el que me pueda colaborarr...
gracias

el primer comentario de lo de trim el tio es un crack ¡ he estado buscando eso y ... aqui esta¡¡ muchisimas gracias¡¡

hola Gente tengo este formulario:
<HTML>
<HEAD>
<TITLE>Formulario de Contacto</TITLE>
</HEAD>
<BODY bgcolor="white">
<h1 align="center">Preguntanos </h1>
<h2 align="center"> Tus consultas </h2>
<TABLE BORDER="1" align="center" bgcolor="#99ffff">
<form action="mailto:a@yo.com" method="post" enctype="text/plain">
<TR>
<td align="center">Apellido:</td>
<td><input type="text" name="txtape" size="30" maxlength="100"></td>
</TR>
<TR>
<td align="center">Nombre:</td>
<td><input type="text" name="txtnom" size="30" maxlength="100"></td>
</TR>
<TR>
<td align="center">Email:</td>
<td><input type="text" name="txtemail" size="25" maxlength="100"></td>
</TR>
<TR>
<td align="center">Telefono:</td>
<td><input type="text" name="txttel" size="20" maxlength="60"></td>
</TR>
<TR>
<td align="center">Fecha de Nacimiento:</td>
<td><input type="text" name="txtfecha" size="6" maxlength="6"></td>
</TR>
<TR>
<td align="center">Descripcion de tu consulta</td>
<td><textarea cols="30" rows="7" name="ttacomentarios">
</textarea><br><br>
<tr>
<td><input type="submit" value="Enviar formulario"></td>
<td><Input type="reset" value="Borrar todo"></td>
</tr>
</TR>
</form>
</TABLE>
</BODY>
</HTML>

y tengo que validar en JAVA el Apellido y Nombre en Mayuscula, el Telefono que sean solo numeros y no deje poner una letra, la fecha que deje poner solo 6 numeros y no mas y tambien valide y en el correo que pueda poner una arroba y un punto toy al horno mal.. alguien me podra dar una mano ?

Felicitarlos es lo menos que se puede hacer, por personas o equipos de trabajo; que tiene el espíritu altruista, cuando se trata del conocimiento de un arte indispensable en la vida moderna; como es el de diseño y aplicaciones web.
Interesante la esplicación gracias.
Eduardo 57VC

esos codigos estan buenos pero como hago cuando tengo menus desplegables..?????

Me ha sido muy útil el artículo, muchas gracias!

Me disculpo, pero no veo en que lugar del codigo va a insertar el segundo codigo, a continuacion del primero o en una pagina aparte?, gracias, Bernardo

Hola,
He creado una factura con acrobat profesional 9 y me ha quedado bastante bien, aunque mi problema es que lo la puedo acabar... los ´´unicos calculos que puedo hacer es sumar, multiplicar y hacer medias...
Me gustaria poder hacer un dto lineal y el calculo del iva... pero no se y no dejo de buscar informacion pero no doy con los codigos necesarios.
Estaria muy agradecida si alguien me ayudase a completar mi factura.
Saludos.
Carol

JEJEJEJEE CrackerTreK haciendo de las suyas!!!

>>>>>>>>>>>>>>>>>>
var fecha1=document.getElementsByName("f_fin")[0].value;
fecha1=fecha1.split("-");
var ano=fecha1[0];
var mes=parseInt(fecha1[1])-1;
var dia=fecha1[2];
var dato=new Date(ano,mes,dia);

alert(dato);
if(dato.getMonth()!=mes)
{
alert("mal fecha");
}
else if(dato.getUTCDate()!=dia)
{
alert("mal fecha");
}
else{
alert("bien la fecha");
}

>>>>>>>>>>>>>>>>>>

UCI fac 8

Hola! Tengo un problemita, y no sé si podrías solucionarmelo. Tengo el siguiente código, y quiero validar que el campo "intereses" seleccione alguna opción que no sea la primera, pero el código que aquí pones no debo de estar ubicándolo bien ya que no me sale el mensaje de alerta si no selecciono motivo.

Mi código que tengo con el resto de campos, etc es este:
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_validateForm() { //v4.0
if (document.getElementById){
var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
if (val) { nm=val.name; if ((val=val.value)!="") {
if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
if (p<1 || p==(val.length-1)) errors+='- El '+nm+' debe contener un e-mail válido. ';
} else if (test!='R') { num = parseFloat(val);
if (isNaN(val)) errors+='- El '+nm+' debe contener un número. ';
if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
min=test.substring(8,p); max=test.substring(p+1);
if (num<min || max<num) errors+='- El '+nm+' debe contener un número entre '+min+' y '+max+'. ';
} } } else if (test.charAt(0) == 'R') errors += '- '+nm+' Es obligatorio. '; }
} if (errors) alert('Se han encontrado los siguientes errores: '+errors);
document.MM_returnValue = (errors == '');
} }



Y debería añadirle

if (document.fvalida.interes.selectedIndex==0){
alert("Debe seleccionar un motivo de su contacto.")
document.fvalida.interes.focus()
return 0;
}

Pero no sé exactamente donde, porque si lo pongo debajo de mi código, no me sale el código de alerta. ¿Me explico?

Y gracias por tu aporte, es una currada de "tutorial".

Hola buenas tardes mira e seguido los ejemplos que tienes aqui en la pagina pero todo sale muy bien al momento de validar el primer y segundo campo si me los valida pero ya el tercer campo como los demas restantes que estoy pidiendo no me los valida como le hago no se la casi de hecho nada de programacion y pues por nesesidad de publisidad en internet heme aqui y por ello solisito tu ayuda aqui te dejo el codigo de como le he hecho.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>WWW.ABATAR.COM.MX:::CONSULTA:::</TITLE>
<META content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<SCRIPT>
function valida_envia(){
//valido el nombre
if (document.contacto.nombres.value.length==0){
alert("Tienes que ingresar tu nombres")
document.contacto.nombres.focus()
return 0;
}

if (document.contacto.apellidos.value.length==0){
alert("Tienes que ingresar tus apellidos")
document.contacto.nombres.focus()
return 0;
}

if (document.contacto.e-mail.value.length==0){
alert("Tienes que ingresar tu e-mail")
document.contacto.e-mail.focus()
return 0;
}

if (document.contacto.pais.value.length==0){
alert("Tiene que ingresar tu pais")
document.contacto.pais.focus()
return 0;
}

if (document.contacto.estado.value.length==0){
alert("Tiene que ingresar tu estado")
document.contacto.estado.focus()
return 0;
}

if (document.contacto.ciudad.value.length==0){
alert("Tiene que ingresar su ciudad")
document.contacto.ciudad.focus()
return 0;
}

if (document.contacto.consulta.value.length==0){
alert("Tiene que ingresar su consulta")
document.contacto.consulta.focus()
return 0;
}

//el formulario se envia
alert("Muchas gracias por enviar el formulario");
document.fvalida.submit();

}
</SCRIPT>

<META name=GENERATOR content="MSHTML 8.00.6001.18876"><style type="text/css">
<!--
body,td,th {
color: #FFFFFF;
}
body {
background-color: #000000;
}
-->
</style></HEAD>
<BODY>
<form id="contacto" name="contacto" method="post" action="enviar2.php" onsubmit=="return validacion_envia()">
<TABLE align="center">
<TBODY>
<TR>
<TD>Nombres: </TD>
<TD><INPUT maxLength=100 size=30 name=nombres></TD></TR>
<TR>
<TD>Apellidos: </TD>
<TD><INPUT maxLength=100 size=30 name=apellidos></TD></TR>
<TR>
<TD>E-mail: </TD>
<TD><INPUT maxLength=100 size=30 name=e-mail></TD></TR>
<TR>
<TD>Pais: </TD>
<TD><INPUT maxLength=100 size=30 name=pais></TD></TR>
<TR>
<TD>Estado: </TD>
<TD><INPUT maxLength=100 size=30 name=estado></TD></TR>
<TR>
<TD>Ciudad: </TD>
<TD><INPUT maxLength=100 size=30 name=ciudad></TD></TR>
<TR>
<TD>Consulta: </TD>
<TD><textarea name="consulta" cols="35" rows="10"></textarea></TD>
</TR>
<TD colSpan=2 align=middle><div align="center">
<input name="Bot&oacute;n" type=button id="Enviar" onClick=valida_envia() value=Bot&oacute;n>
</div></TD></TR></TBODY></TABLE>
</FORM></BODY></HTML>

tambien cuando le cambio el nombre del buton que por original lo tiene como botón este funsiona bien validandome solo los dos primeros campos y cuando le cambio el nombre a enviar este ya no hace nada pero cuando lo checo su funsionalidad en el explorardo este me dise que listo pero con errores en la pagina
como le hago para solusionar estos errores, aparte tengo el codigo de un sistema de captcha como le hago para incrustarle el captcha a este formulario por que anteriormente.Grasias te lo sgradeseria muy eternamente.

El script esta muy muy bueno, me ha servido un montón en realidad lo use para validar una fecha y que no sea superior a la actual, le note un solo error, en los años biciestos el control permite poner 29 de febrero que esta muy bien, pero tambien permite ingresar 30 de febrero lo que no estaría bien, agregue una linea más y lo solucioné, muchas gracias por la publicación.

OIE PERO CUENTAME COMO HAGO PARA QUE LLEGE A MI MAIL LOS MENSAJES CON ESTE JAVA SCRIP

public static Boolean validarCuentaBancaria(String cuenta)
{
Pattern cuentaPattern = Pattern.compile("\d{20}");
Matcher m = cuentaPattern.matcher(cuenta);
if (m.matches())
{
// cuenta cumple el patrón (20 dígitos)
String banco = cuenta.substring(0, 4);
String sucursal = cuenta.substring(4,8);
String dC = cuenta.substring(8, 10);
String CCC = cuenta.substring(10, 20);
if (!( obtenerDigito("00" + banco + sucursal ) == Integer.parseInt(String.valueOf(dC.charAt(0))))
||!(obtenerDigito(CCC) == Integer.parseInt(String.valueOf(dC.charAt(1)))))
return false;
else
return true;
}
return false;

}


public static int obtenerDigito(String valor)
{
Integer[] valores = new Integer[]{1, 2, 4, 8, 5, 10, 9, 7, 3, 6};

Integer control = 0;
for (int i=0; i <=9; i++)
control += Integer.parseInt(String.valueOf(valor.charAt(i))) * valores[i];
control = 11 - (control % 11);
if (control == 11)
control = 0;
else if (control == 10)
control = 1;
return control;
}

falto la función validar entero es así:

el código original.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
</head>
<script language="javascript">
function validarEntero(valor){
//intento convertir a entero.
//si era un entero no le afecta, si no lo era lo intenta convertir
valor = parseInt(valor)

//Compruebo si es un valor numérico
if (isNaN(valor)) {
//entonces (no es numero) devuelvo el valor cadena vacia
return ""
}else{
//En caso contrario (Si era un número) devuelvo el valor
return valor
}
}

function valida_envia(){
//valido el nombre
if (document.fvalida.nombre.value.length==0){
alert("Tiene que escribir su nombre")
document.fvalida.nombre.focus()
return 0;
}

//valido la edad. tiene que ser entero mayor que 18
edad = document.fvalida.edad.value
edad = validarEntero(edad)
document.fvalida.edad.value=edad
if (edad==""){
alert("Tiene que introducir un número entero en su edad.")
document.fvalida.edad.focus()
return 0;
}else{
if (edad<18){
alert("Debe ser mayor de 18 años.")
document.fvalida.edad.focus()
return 0;
}
}

//valido el interés
if (document.fvalida.interes.selectedIndex==0){
alert("Debe seleccionar un motivo de su contacto.")
document.fvalida.interes.focus()
return 0;
}

//el formulario se envia
alert("Muchas gracias por enviar el formulario");
document.fvalida.submit();
}
</script>

<body>
<form name="fvalida">
<table>
<tr>
<td>Nombre: </td>
<td><input type="text" name="nombre" size="30" maxlength="100"></td>
</tr>
<tr>
<td>Edad: </td>
<td><input type="text" name="edad" size="3" maxlength="2"></td>
</tr>
<tr>
<td>Interés:</td>
<td>
<select name=interes>
<option value="Elegir">Elegir
<option value="Comercial">Contacto comercial
<option value="Clientes">Atención al cliente
<option value="Proveedores">Contacto de proveedores
</select>
</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="button" value="Enviar" onclick="valida_envia()"></td>
</tr>
</table>
</form>
</body>
</html>

hola!!!
me gusta todo lo que se explica
por que si le entiendo bien y asi me gusta que expliquen paso por paso para poder analizar todo
bueno pues gracias por su informacion me sirvio de mucho

Hola como stan pido ayuda asu sabio conocimiento chicos:
se q ustedes son los elegidos del javascripts y pido su ayuda a este umilde mortal con problemas.

gracias a todos ustedes.

tengo este inconveniente:
sucede q tengo 3 paguinas: A,B,C
A=paguina principal
B y C=paguinas segundarias

Tengo un div en A, donde este div carga la paguina B atravez de un link en A,
y cuando quiero carga la paguina C en el mismo div de A con un boton de B, el evento onclick no realiza la funcion.

Mi objetivo en esto es validar algunos controles como cajas de texto,radios y select
antes de pasar ala paguina C

////////utilise ajax para cargar en el div la paguina B,cargare la paguina C con ajax pero antes tengo q validar controles de B.

He notado q los codigos de javascripts no funcionan en la paguina B q si quiero q funcione tengo q colocarlo en A. Pero en este caso no funciona la funcion para validar con onclick(valida_envia)

Otro detalle porque sucede esto q funcione javascript en una paguina y en otra no,es acaso por ser contenedora A y B es una hija de A. ¿Lo dije bien?
¿me pueden explicar?

////////////
este es el codigo q utilizo en onclick en la paguian A,he probado el mismo codigo en A y B y no funciona ,¿q estoy haciendo mal?:

<script type="text/javascript">
function valida_envia(txtemail){
//valido el email
var obj=document.getElementById(txtemail);
if (obj.value.length==0){
alert("Tiene que escribir su email")
obj.value="xxx";
obj.focus()
return 0;
}
</script>

/////////////////////////GRACIAS//////////////////////////////////

Por amor de Dios muchas gracias ya pude validar mi formulario, que buen aporte espero algun dia ayudar tanto como lo han hecho ustedes

Ese metodo no sirve, si muestra el mensaje pero igual deja oasar

Bueno a ver si algien me puede ayudar la cosa es esto .....yo tengo un formulario que valida si en los numeros ingresa numeros y que en el nombre solo ingresen letras ahora en lo qeu se me complica es esto que por ej en un campo especifico por decir un ejemplo apellido ingrese solamente un apellido "perez" por ejemplo y si no es asi que no ingrese ...aca abajo pongo el codigo por favor si algien me puede ayudar me vendria barbaro!
<!-- saved from url=(0096)file:///C:/Documents%20and%20Settings/usuario/Mis%20documentos/Downloads/TrabajoFinal%20(2).html -->
<HTML><HEAD><META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE> Gimnasio amici </TITLE>
<SCRIPT>
var Nombre= new Array()
var Apellido= new Array()
var Telefono= new Array()
var Nrodedoc= new Array()
var Sexo= new Array()
var Actividad= new Array()
var Nrodeafiliado= new Array()
var i=0
var j=0
function funcargar(nom,ape,tel,doc,sex,act,num)
{
Nombre[i]=nom
Apellido[i]=ape
Telefono[i]=tel
Nrodedoc[i]=doc
Sexo[i]=sex
Actividad[i]=act
Nrodeafiliado[i]=num
++i
document.frmformulario.txtNombre.value=""
document.frmformulario.txtApellido.value=""
document.frmformulario.txtTelefono.value=""
document.frmformulario.txtNrodedoc.value=""
document.frmformulario.txtSexo.value=""
document.frmformulario.txtActividad.value=""
document.frmformulario.txtNrodeafiliado.value=""
document.frmformulario.cmdmostrar.enabled=false
document.frmformulario.txtNombre.focus()
}
function funmostrar()
{
document.write("")
document.write("<table width=80% cellspaddig=2 align=center>")
document.write("<tr>")
document.write("<td colspan=5 align=center>"+"<b>"+"<h2>Gimnasio Amici"+"</h2>"+"</b>"+"</td>")
document.write("</tr>")
document.write("<tr align=left>")
document.write("<td>Nombre"+"</td>"+"<td>Apellido"+"</td>"+"<td>Telefono"+"</td>"+"<td>Nro de documento"+"</td>"+"<td>Sexo"+"</td>"+"<td>Actividad"+"</td>"+"<td>Nro de afiliado"+"</td>")
document.write("</tr>")
for(j=0;j<=(i-1);j++)
{
document.write("<tr>")
document.write("<td>"+Nombre[j]+"</td>"+"<td>"+Apellido[j]+"</td>"+"<td>"+Telefono[j]+"</td>"+"<td>"+Nrodedoc[j]+"</td>"+"<td>"+Sexo[j]+"</td>"+"<td>"+Actividad[j]+"</td>"+"<td>"+Nrodeafiliado[j]+"</td>")
document.write("</tr>")
}
document.write("</table>")
document.bgColor="#339999"
}
function validarSiNumero(numero)
{
if (!/^([0-9])*$/.test(numero))
alert("El valor " + numero + " no es un número");
}
function validar()
{
if(/[^aA-zZ]/.test(document.formulario.campo.value)) return false;
return true;
}
</SCRIPT>
</HEAD><BODY bgcolor="#006666">
<FORM name="frmformulario">
<TABLE name="ingresadatos" align="center">
<TBODY><TR>
<TD colspan="2"> <B></B><H2><B> Gimnasio Amici </B></H2></TD>
</TR><TR>
<TD>Nombre:</TD>
<TD><INPUT type="text" name="txtNombre" value="" size="15" maxlength="16" onkeyup="this.value = this.value.replace (/[^aA-zZ]/, &#39;&#39;);">
</TD></TR>
<TR>
<TR>
<TD>Apellido:</TD>
<TD><INPUT type="text" name="txtApellido" value="" size="12" maxlength="15" onkeyup="this.value = this.value.replace (/[^aA-zZ]/, &#39;&#39;);">
</TD></TR>
<TR>
<TD>Telefono:</TD>
<TD><INPUT type="text" name="txtTelefono" value="" size="10" maxlenght="12" onchange="validarSiNumero(this.value);"></TD>
</TR>
<TR>
<TD>Numero de doc:</TD>
<TD><INPUT type="text" name="txtNrodedoc" value="" size="9" maxlenght="8" onchange="validarSiNumero(this.value);"></TD>
</TR>
<TR>
<TD>Sexo:</TD>
<TD><SELECT name="txtSexo">
<OPTION value="Masculino">Masculino
</OPTION><OPTION value="Femenino">Femenino
</OPTION></SELECT></TD>
</TR><TR>
<TD>Actividad:</TD>
<TD><SELECT name="txtActividad">
<OPTION value="Maquinas">Maquinas
</OPTION><OPTION value="Yoga">Yoga
</OPTION><OPTION value="Pilates">Pilates
</OPTION><OPTION value="Todas">Todas
</OPTION></SELECT></TD>
</TR>
<TR>
</TR><TR>
<TR>
<TD>Nro de afiliado</TD>
<TD><INPUT type="text" name="txtNrodeafiliado" value="" size="4" onchange="validarSiNumero(this.value);"></TD>
</TR>
<TR>
<TR>
<TR>
<TR>
<TD><INPUT type="button" name="cmdcargar" value="Cargar" onclick="funcargar(document.frmformulario.txtNombre.value, document.frmformulario.txtApellido.value, document.frmformulario.txtTelefono.value, document.frmformulario.txtNrodedoc.value, document.frmformulario.txtSexo.value, document.frmformulario.txtActividad.value, document.frmformulario.txtNrodeafiliado.value)">
<INPUT type="button" name="cmdmostrar" value="Mostrar" onclick="funmostrar()">
</TD>
</TR>
</TBODY></TABLE>
</FORM>

</BODY></HTML>

soy principiante en javascript, la verdad es que siempre confío en este sitio para resolver mis dudas, es excelente y he logrado aprender sobre web, pero ahora, por falta de tiempo, no he podido leer los manuales de javascript. He consultado este post y crei que para hacer funcionar el formulario podia cortar y pegar el codigo que ofreceis, en una pagina html, pero no puedo hacer funcionar el formulario, lei que tiene errores, por lo que PEDIRIA por favor, a ser posible, os fijeis un poquito mas en escribir el código. Gracias

Amigo necesito su ayuda... tengo un archivo php asi:




<html>
<script language="javascript" type="text/javascript" src="validar.js"></script>
<form name="f" method="post" enctype="text/plain" action="contactoform.php" onSubmit="return Validar(this);">
<label for="X"> </label>
<br><br>
<label for="nombre">Nombre Completo: </label> <br> <input name="nombre" size="50" maxlength="80" type="text"><br>
<label for="email">Email (Dato Necesario para Responderle): </label> <br> <input name="email" size="50" maxlength="60" type="text"><br>
<label for="asunto">Tema Solicitud: </label> <br> <input name="asunto" size="50" maxlength="60" type="text"><br>
<label for="mensaje">Descripcion: </label> <br> <textarea name="mensaje" cols="31" rows="5"></textarea> <br>
<label for="enviar">
<input name="enviar" value="Enviar" type="submit"></label>
<br><br>
</form>
</html>


<?php

///////Configuraci?///
$mail_destinatario = 'informaticax.com.co@gmail.com';
///////Fin configuraci?

if (isset ($_POST['enviar'])) {
$headers .= "From: ".$_POST['email']. "";
if ( mail ($mail_destinatario, $_POST['asunto'], "NOMBRE COMPLETO: ".$_POST['nombre']." ASUNTO: ".stripcslashes ($_POST['asunto'])." MENSAJE : ".stripcslashes ($_POST['mensaje']), $headers )) echo '*** Su mensaje a sido enviado correctamente. Gracias por contactar con nosotros. *** ';
else
echo '*** Error al enviar el formulario. Por favor, intentelo de nuevo mas tarde. ***'; }

?>



y tengo el validar.js asi:

// JavaScript Document
//Funci?ue verifica campos del formulario vac?
function Validar(f) {
var nombre = document.getElementById("nombre").value;
var email = document.getElementById("email").value;
var mensaje = document.getElementById("mensaje").value;

if (nombre=="") { alert("Por favor escriba su Nombre completo");
f.nombre.focus();
return false;
}

if (f.email.value=="")
{ alert("Por favor escriba su direccixF3n de correo electrxF3nico");
f.email.focus();
return false; }

if (f.mensaje.value=="")
{ alert("Por favor escriba su Mensaje.");
f.mensaje.focus();
return false; }
}

y no me funciona, dejo los campos en blanco del formulario y manda el email vacio, sin validar nada...


Gracias por su ayuda......

Amigo necesito su ayuda... tengo un archivo php asi:




<html>
<script language="javascript" type="text/javascript" src="validar.js"></script>
<form name="f" method="post" enctype="text/plain" action="contactoform.php" onSubmit="return Validar(this);">
<label for="X"> </label>
<br><br>
<label for="nombre">Nombre Completo: </label> <br> <input name="nombre" size="50" maxlength="80" type="text"><br>
<label for="email">Email (Dato Necesario para Responderle): </label> <br> <input name="email" size="50" maxlength="60" type="text"><br>
<label for="asunto">Tema Solicitud: </label> <br> <input name="asunto" size="50" maxlength="60" type="text"><br>
<label for="mensaje">Descripcion: </label> <br> <textarea name="mensaje" cols="31" rows="5"></textarea> <br>
<label for="enviar">
<input name="enviar" value="Enviar" type="submit"></label>
<br><br>
</form>
</html>


<?php

///////Configuraci?///
$mail_destinatario = 'informaticax.com.co@gmail.com';
///////Fin configuraci?

if (isset ($_POST['enviar'])) {
$headers .= "From: ".$_POST['email']. "";
if ( mail ($mail_destinatario, $_POST['asunto'], "NOMBRE COMPLETO: ".$_POST['nombre']." ASUNTO: ".stripcslashes ($_POST['asunto'])." MENSAJE : ".stripcslashes ($_POST['mensaje']), $headers )) echo '*** Su mensaje a sido enviado correctamente. Gracias por contactar con nosotros. *** ';
else
echo '*** Error al enviar el formulario. Por favor, intentelo de nuevo mas tarde. ***'; }

?>



y tengo el validar.js asi:

// JavaScript Document
//Funci?ue verifica campos del formulario vac?
function Validar(f) {
var nombre = document.getElementById("nombre").value;
var email = document.getElementById("email").value;
var mensaje = document.getElementById("mensaje").value;

if (nombre=="") { alert("Por favor escriba su Nombre completo");
f.nombre.focus();
return false;
}

if (f.email.value=="")
{ alert("Por favor escriba su direccixF3n de correo electrxF3nico");
f.email.focus();
return false; }

if (f.mensaje.value=="")
{ alert("Por favor escriba su Mensaje.");
f.mensaje.focus();
return false; }
}

y no me funciona, dejo los campos en blanco del formulario y manda el email vacio, sin validar nada...


Gracias por su ayuda......

Amigos tengo este formulario:




<html>
<script language="javascript" type="text/javascript" src="validar.js"></script>
<form name="f" method="post" enctype="text/plain" action="contactoform.php" onSubmit="return Validar(this);">
<label for="X"> </label>
<br><br>
<label for="nombre">Nombre Completo: </label> <br> <input name="nombre" size="50" maxlength="80" type="text"><br>
<label for="email">Email (Dato Necesario para Responderle): </label> <br> <input name="email" size="50" maxlength="60" type="text"><br>
<label for="asunto">Tema Solicitud: </label> <br> <input name="asunto" size="50" maxlength="60" type="text"><br>
<label for="mensaje">Descripcion: </label> <br> <textarea name="mensaje" cols="31" rows="5"></textarea> <br>
<label for="enviar">
<input name="enviar" value="Enviar" type="submit"></label>
<br><br>
</form>
</html>


<?php

///////Configuración/////
$mail_destinatario = 'informaticax.com.co@gmail.com';
///////Fin configuración//

if (isset ($_POST['enviar'])) {
$headers .= "From: ".$_POST['email']. "";
if ( mail ($mail_destinatario, $_POST['asunto'], "NOMBRE COMPLETO: ".$_POST['nombre']." ASUNTO: ".stripcslashes ($_POST['asunto'])." MENSAJE : ".stripcslashes ($_POST['mensaje']), $headers )) echo '*** Su mensaje a sido enviado correctamente. Gracias por contactar con nosotros. *** ';
else
echo '*** Error al enviar el formulario. Por favor, intentelo de nuevo mas tarde. ***'; }

?>



y esta es la funcion javascript


// JavaScript Document
//Función que verifica campos del formulario vacíos
function Validar(f) {
var nombre = document.getElementById("nombre").value;
var email = document.getElementById("email").value;
var mensaje = document.getElementById("mensaje").value;

if (nombre=="") { alert("Por favor escriba su Nombre completo");
f.nombre.focus();
return false;
}

if (f.email.value=="")
{ alert("Por favor escriba su direccixF3n de correo electrxF3nico");
f.email.focus();
return false; }

if (f.mensaje.value=="")
{ alert("Por favor escriba su Mensaje.");
f.mensaje.focus();
return false; }
}

y nada me funciona, dejo los campos en blanco y se evia... que puede ser?



Gracias...

Tengo una duda acerca de como hacer para programar con Javascript un campo de fecha que tenga un formato fijo por ejemplo yo quiero que muestre el campo así "00/00/0000" . Alguien me podrá responder.
Desde ya gracias.