Foros del Web » Programando para Internet » Javascript »

Tropezones de novato

Estas en el tema de Tropezones de novato en el foro de Javascript en Foros del Web. Hola Amig@s: Acabo de empezar a hacer páginas web y me encuentro con uno de esos fallos de novato que no sé exactamente donde está. ...
  #1 (permalink)  
Antiguo 25/09/2012, 03:13
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Tropezones de novato

Hola Amig@s:

Acabo de empezar a hacer páginas web y me encuentro con uno de esos fallos de novato que no sé exactamente donde está.

Pretendo validar tanto, el nombre del usuario, que en este caso es un correo electrónico, como la contraseña que introduzca el cliente. No sé por qué aún escribiendo una dirección de correo correcta me lanza el mensaje de que es incorrecto el nombre de usuario.

Por ignorancia he creado tres formularios en la misma página para la entrada de cada uno de los datos. Uno para el campo Usuario del formulario, otro para el campo contraseña del formulario y otro para el botón de enviar.

Este es el código HTML que he puesto:

<td><div align="right">Usuario</div></td>
<td><form id="form2" name="form2" method="post" action="">
<label>
<input type="text" name="Usuario" id="Usuario" />
</label>
</form></td>
...
<td><div align="right">Contraseña</div></td>
<td><form id="form3" name="form3" method="post" action="">
<label>
<input type="password" name="contraseña" id="contraseña" />
</label>
</form></td>
...
<td colspan="2"><form id="form1" name="form1" method="post" action="" onsubmit="return ValidarUsuario() && Validarcontraseña()" >
<label>
<div align="center">
<input type="submit" name="Entrar" id="Entrar" value="Entrar" />
</div>
</label>
</form></td>

Y este es el código JavaScript:

function ValidarUsuario()
{
valor = document.getElementById("Usuario").value;
if (document.form2.Usuario.value.length==0)
{
alert('Introduzca su email');
document.form2.Usuario.focus();
}
else
if( !(/^\w+([\-_.]?\w+)*@\w+([\-_.]?\w+)*(\.\w{2,3,4})+$/.test(valor)) )
{
alert('Usuario no registrado');
document.form2.Usuario.focus();
}
else
{
return true;
}
}
function ValidarContraseña()
{
if (document.form3.contraseña.value.length>8)
{
alert('Contraseña incorrecta');
contraseña.focus();
contraseña.select();
}
else
return true
}
//-->
</script>

Supongo que es algo muy sencillo pero no doy con ello ... me echáis una mano?Gracias!
  #2 (permalink)  
Antiguo 25/09/2012, 07:52
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Tropezones de novato

Bienvenido al foro, te recomiendo usar el Highlight para mostrar código

NO debes usar 1 form por cada elemento, debes usar 1 solo form para todo

debes usar las colecciones debido a que hay navegadores que no soportan la referencia directa:

document.forms['form_name'].elements['input_name'].value

de preferencia utiliza el evento onsubmit del formulario para validar.

consulte un manual de JS: http://www.librosweb.es/javascript/index.html

Nota: la validación en JS es opcional, recuerde siempre validar en el servidor, es mucho más seguro.
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 26/09/2012, 01:10
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Muchas gracias Maycol, voy a echar un vistazo al manual
  #4 (permalink)  
Antiguo 26/09/2012, 03:25
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Hola de nuevo Maycol;

Ya he probado a convertir los formularios en uno solo y he operado los cambios que me ha dicho y sigue sin funcionarme. Ahora, con estos cambios, no me aparece el primer mensaje de modo que he vuelto a como lo tenía antes excepto lo de que sea en un único formulario.

Con el código tal cual lo tenía escrito (cambiando a un único formulario) vuelvo a tener el mismo error que tenía; me aparece el mensaje de error 'Usuario no registrado' metiendo una dirección de email válida para la expresión regular que tengo en el segundo If de la función 'Validar'.

He revisado varias veces la expresión regular en búsca de algún error y sigo sin ver por qué no funciona.

¿qué es lo que tengo mal?

Un saludo
  #5 (permalink)  
Antiguo 26/09/2012, 07:08
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Tropezones de novato

postea el código que tienes, así veremos el error y te corregimos y aprendes, recuerda usar el highlight.

además ese mensaje de usuario no registrado no es semántico, en realidad no estás comparando contra una base de datos de usuarios
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #6 (permalink)  
Antiguo 27/09/2012, 01:51
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Ok, Ahí va el código

Código Javascript:
Ver original
  1. function ValidarUsuario()
  2. {
  3.     valor = document.getElementById("Usuario").value;
  4.     if (document.form1.Usuario.value.length==0)
  5.     {
  6.     alert('Introduzca su email');
  7.     document.form1.Usuario.focus();
  8.     }
  9.     else
  10.     if( !(/^\w+([\-_.]?\w+)*@\w+([\-_.]?\w+)*(\.\w{2,3,4})+$/.test(valor)) )
  11.     {
  12.     alert('Usuario no registrado');
  13.     document.form1.Usuario.focus();
  14.     }
  15.     else
  16.     {
  17.     return true;
  18.     }
  19.     }
  20. function ValidarContraseña()
  21. {
  22.     contraseña= document.getElementById("contraseña").value
  23.     if (!/^([0-9])*$/.test(contraseña))
  24.     {
  25.       alert("Contraseña incorrecta");
  26.         contraseña.focus();
  27.         contraseña.select();
  28.     }
  29.     else
  30.     return true
  31. }

y el formulario:

Código HTML:
Ver original
  1. <form id="form1" name="form1" method="post" action="" onsubmit="return ValidarUsuario() && ValidarContraseña()">
  2. <td><div align="right">Usuario</div></td>
  3.       <td><label>
  4.         <input type="text" name="Usuario" id="Usuario" />
  5.       </label></td>
  6. <td><div align="right">Contraseña</div></td>
  7.       <td><label>
  8.         <input type="password" name="contraseña" id="contraseña" />
  9.       </label></td>
  10. <td colspan="2"><label>
  11.         <div align="center">
  12.           <input type="submit" name="Entrar" id="Entrar" value="Entrar"  />
  13.         </div>
  14.         </label></td>
  15. </form>
  #7 (permalink)  
Antiguo 27/09/2012, 07:47
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Tropezones de novato

correcciones a aplicar:

1 - Indicado anteriormente debes usar las colecciones debido a que hay navegadores que no soportan la referencia directa:

document.forms['form_name'].elements['input_name'].value

2 - declaración explicita de variables con var:

var valor = document.getElementById("Usuario").value;

3 - al validar, en cuanto aparezca un error, debes devolver false:

Código Javascript:
Ver original
  1. if (document.forms['form1'].elements['Usuario'].value.length==0)
  2.     {
  3.         alert('Introduzca su email');
  4.         document.forms['form1'].elements['Usuario'].focus();
  5.         return false; //AQUI
  6.     }

5 - Por un lado usas getElementById y por el otro accedes directamente al objeto, por estándar deberías usar el uno u otro, pero no hay nada que te obligue a no hacerlo, sólo tenlo en cuenta

corrija, pruebe y comente

PD: podrías usar una sóla función, aunque como lo implementas tambien vale
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #8 (permalink)  
Antiguo 28/09/2012, 03:13
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Gracias Maycol pero he aplicado los cambios que me has sugerido y sigue dándome el mismo error. Te paso el código tal cual lo he dejado no sea que no lo haya entendido bien.

Código Javascript:
Ver original
  1. function ValidarUsuario()
  2. {
  3.     var valor = document.forms['form1'].elements['Usuario'].value;
  4.     if (document.forms['form1'].elements['Usuario'].value.length==0)
  5.     {
  6.     alert('Introduzca su email');
  7.     document.forms['form1'].elements['Usuario'].focus();
  8.     return false;
  9.     }
  10.     else
  11.     if(!(/^\w+([\-_.]?\w+)*@\w+([\-_.]?\w+)*(\.\w{2,3,4})+$/.test(valor)) )
  12.     {
  13.     alert('Usuario no registrado');
  14.     document.forms['form1'].elements['Usuario'].focus();
  15.     return false;
  16.     }
  17.     else
  18.     {
  19.     return true;
  20.     }
  21.     }

Un saludo
  #9 (permalink)  
Antiguo 28/09/2012, 12:25
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Tropezones de novato

¿cual error?, tienes que ver y analizar lo que estás haciendo, porque estas aplicando una expresión regular de email al nombre del usuario cuando debes de aplicársela al email

todo lo anterior fue para descartar verdaderos errores del código, por lo que el error está en la lógica que aplicas, esto NO tiene sentido y lo extraño es que no te dieras cuenta :

aquí validas usuario con una expresión para email, y no al email

var valor = document.forms['form1'].elements['Usuario'].value;

Código Javascript:
Ver original
  1. else if(!(/^\w+([\-_.]?\w+)*@\w+([\-_.]?\w+)*(\.\w{2,3,4})+$/.test(valor)) )
  2.     {
  3.         alert('Usuario no registrado');
  4.         document.forms['form1'].elements['Usuario'].focus();
  5.         return false;
  6.     }
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #10 (permalink)  
Antiguo 01/10/2012, 04:07
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Gracias Maycol.

Discúlpame pero debo de estar muy obtuso.

Sigo sin entender a qué te refieres con lo de que "le estoy aplicando una expresión regular de email al nombre del usuario y no al email", porque lo que el cliente ha de introducir en el campo usuario es su email, con lo cual la expresión regular se la aplico al email que introduce el cliente en el campo usuario del formulario.

No me entero.

Un saludo
  #11 (permalink)  
Antiguo 01/10/2012, 06:52
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Tropezones de novato

mmm, entonces el fallo puede ser la expresión, ¿intentaste probar otras?: http://stackoverflow.com/questions/4...-in-javascript
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #12 (permalink)  
Antiguo 02/10/2012, 01:38
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Cita:
Iniciado por maycolalvarez Ver Mensaje
mmm, entonces el fallo puede ser la expresión, ¿intentaste probar otras?: [url]http://stackoverflow.com/questions/46155/validate-email-address-in-javascript[/url]
Si, claro que el fallo puede ser la expresión, eso te pregunté hace unos cuantos días. He probado otra expresión pero pasa exactamente lo mismo. Si es cuestión de probar expresiónes ... pues nada a probar.
  #13 (permalink)  
Antiguo 02/10/2012, 02:32
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Finalmente era fallo de la expresión. Gracias por el Link
  #14 (permalink)  
Antiguo 04/10/2012, 02:11
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Hola de nuevo Maycol.

Como ves no ha durado mucho la alegría en la casa del pobre porque vuelvo a tener problemas al validar otro formulario.

El caso es que al introducir mal los datos, si le doy al botón de enviar que activa la función Validar contacto, no me aparece el mensaje de error correspondiente.

Obviamente para probar que no salta el mensaje de error al validar contacto he dejado en blanco el nombre, no lo he rellenado o he puesto un espacio. Que son las opciones que figuran en la condición del bucle.

Obviamente también he comprobado que cada uno de los nombres de los elementos, los del formulario y la llamada a la función están bien.

Aquí te dejo el código:

Código Javascript:
Ver original
  1. <script language="javascript">
  2. <!--
  3. function ValidarContacto()
  4. {
  5.     var Nombre = document.forms['form1'].elements['nombrecontacto'].value;
  6.     var Apellido = document.forms['form1'].elements['apellido1contacto'].value;
  7.     var Telefono = document.forms['form1'].elements['telefonocontacto'].value;
  8.     var Email = document.forms['form1'].elements['emailcontacto'].value;
  9.     var Consulta = document.forms['form1'].elements['Consultacontacto'].value;
  10.     var Tipoconsulta = document.forms['form1'].elements['TipoContacto'];
  11.     if (Nombre == null || Nombre.length == 0 || /^\s$/.test(Nombre))
  12.     {
  13.     alert('Introduzca su nombre');
  14.         document.forms['form1'].elements['nombrecontacto'].focus();
  15.         document.forms['form1'].elements['nombrecontacto'].select();
  16.         return false;
  17.     }
  18.     else
  19.     if (Apellido == null || Apellido.length == 0 || /^\s$/.test(Apellido))
  20.     {
  21.     alert('Introduzca su Apellido');
  22.         document.forms['form1'].elements['apellido1contacto'].focus();
  23.         document.forms['form1'].elements['apellido1contacto'].select();
  24.         return false;
  25.     }
  26.     else
  27.     if(!= /^\d{9}$/.test(Telefono))
  28.     {
  29.     alert('Introduzca su número de teléfono');
  30.     document.forms['form1'].elements['telefonocontacto'].focus();
  31.     document.forms['form1'].elements['telefonocontacto'].select();
  32.     return false;
  33.     }
  34.     else
  35.     if (Email.length == 0 || !(/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\ ".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(Email))))
  36.     {
  37.     alert('Introduzca su email');
  38.     document.forms['form1'].elements['emailcontacto'].focus();
  39.     document.forms['form1'].elements['emailcontacto'].select();
  40.     return false;
  41.     }
  42.     if (Consulta == null || Consulta.length == 0 || /^\s$/.test(Consulta))
  43.     {
  44.     alert('Explique brevemente el motivo de su consulta');
  45.         document.forms['form1'].elements['Consultacontacto'].focus();
  46.         document.forms['form1'].elements['Consultacontacto'].select();
  47.         return false;
  48.     }
  49.     else
  50.     var seleccionado = false;
  51.     for(var i=0; i<Tipoconsulta.length; i++)
  52.     {  
  53.     if(opciones[i].checked)
  54.     {
  55.     seleccionado = true;
  56.     break;
  57.     }
  58.     if(!seleccionado)
  59.     {
  60.     alert('Seleccione una opción');
  61.     document.forms['form1'].elements['TipoContacto'].focus();
  62.     document.forms['form1'].elements['TipoContacto'].select();
  63.     return false;
  64. }
  65. }
  66. else
  67. return true;
  68. }
  69. //-->
  70. </script>
  71. </head>

A ver si ves por dónde está el error porque no consigo verlo

Un saludo
  #15 (permalink)  
Antiguo 08/10/2012, 01:33
 
Fecha de Ingreso: septiembre-2012
Ubicación: Madrid
Mensajes: 11
Antigüedad: 11 años, 7 meses
Puntos: 0
Respuesta: Tropezones de novato

Maycol ... ¿andas por ahí?

Etiquetas: formulario, html, input, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:35.