Foros del Web » Programando para Internet » Javascript »

Validar Formulario con Javascript

Estas en el tema de Validar Formulario con Javascript en el foro de Javascript en Foros del Web. Buenas, antes de nada daros las gracias, indicar que mi duda es la siguiente, he encontrado un codigo para validar los campos antes de enviar ...
  #1 (permalink)  
Antiguo 23/05/2011, 17:13
Avatar de ramiguens  
Fecha de Ingreso: mayo-2011
Mensajes: 57
Antigüedad: 12 años, 11 meses
Puntos: 4
Validar Formulario con Javascript

Buenas, antes de nada daros las gracias, indicar que mi duda es la siguiente, he encontrado un codigo para validar los campos antes de enviar un formulario me funciona bien con los TEXTFIELD me detecta si estan cubiertos y si no lo estan me da un error al dar a enviar y me los colorea poniendo una opcion en el css mi problema es que tambien quiero que me valide que tengan cubierto un campo contraseña y su confirmacion asi como un checkbox de conformidad y no se como hacerlo, el codigo es el siguiente coloreo en rojo lo que creo que es la parte que dice que valide los textfield, agradezco cualquier ayuda.

(function()
{
if(window.addEventListener) window.addEventListener("load", init, false);
else if (window.attachEvent) window.attachEvent("onload", init);

function init()
{
for(var i=0; i < document.forms.length; i++)
{
var f = document.forms[i];
var needsValidation = false;
for(j = 0; j < f.elements.length; j++)
{
var e = f.elements[j];
if(e.type != "text") continue;
var pattern = e.getAttribute("pattern");
var required = e.getAttribute("required") != null;

if (required && !pattern)
{
pattern = "\\S";
e.setAttribute("pattern", pattern);
}
if (pattern)
{
e.onchange = validateOnChange;
needsValidation = true;
}
}
if (needsValidation) f.onsubmit = validateOnSubmit;
}
}
function validateOnChange()
{
var textfield = this;
var pattern = textfield.getAttribute("pattern");
var value = this.value;
if (value.search(pattern) == -1) textfield.className = "invalid";
else textfield.className = "valid";

}
function validateOnSubmit()
{
var invalid = false;
for(var i=0; i < this.elements.length; i++)
{
var e = this.elements[i];
if(e.type == "text" && e.onchange == validateOnChange)
{
e.onchange();
if (e.className == "invalid") invalid = true;
}
}
if(invalid)
{
alert('invalido');
return false;
}
}
})();
  #2 (permalink)  
Antiguo 26/05/2011, 09:46
 
Fecha de Ingreso: septiembre-2004
Ubicación: La Plata Argentina
Mensajes: 128
Antigüedad: 19 años, 7 meses
Puntos: 9
Respuesta: Validar Formulario con Javascript

Hola.

Para la password, puedes intentar reemplazando la linea :

if(e.type != "text") continue;

por

if(!(e.type == "text" || e.type == "password") ) continue;

para el check, habria que ver como esta construido el form

Saludos
  #3 (permalink)  
Antiguo 26/05/2011, 10:14
Avatar de ramiguens  
Fecha de Ingreso: mayo-2011
Mensajes: 57
Antigüedad: 12 años, 11 meses
Puntos: 4
Respuesta: Validar Formulario con Javascript

Cita:
Iniciado por sysmadryn Ver Mensaje
Hola.

Para la password, puedes intentar reemplazando la linea :

if(e.type != "text") continue;

por

if(!(e.type == "text" || e.type == "password") ) continue;

para el check, habria que ver como esta construido el form

Saludos
Antes de nada muchas gracias por el aporte, cualquier idea es bien recibida he probado lo que me dices pero continua sin colorearme el "cajon" en cuanto a lo del check seria...

<input type="checkbox" name="privacidad" required />

Muchisimas gracias por tu respuesta.
  #4 (permalink)  
Antiguo 26/05/2011, 10:19
Avatar de ramiguens  
Fecha de Ingreso: mayo-2011
Mensajes: 57
Antigüedad: 12 años, 11 meses
Puntos: 4
Respuesta: Validar Formulario con Javascript

Cita:
Iniciado por sysmadryn Ver Mensaje
Hola.

Para la password, puedes intentar reemplazando la linea :

if(e.type != "text") continue;

por

if(!(e.type == "text" || e.type == "password") ) continue;

para el check, habria que ver como esta construido el form

Saludos
Despues de ver tu respuesta le di otra vuelta al modulo y proband probando modifique poniendo lo que te adjunto mas abajo y funcion sin ningun problemas, si no llega a ser por tu respuesta no se me hubiese ocurrido, muchas gracias, ahora solo me falta lo del checkbox ya que al cubrir los datos menos el checkbox me lo envia igual, gracias por tu respuesta.

var e = this.elements[i];
if(e.type == "text" || e.type == "password")
{
if (e.onchange == validateOnChange)
{
e.onchange();
if (e.className == "invalid") invalid = true;
}

Última edición por ramiguens; 26/05/2011 a las 10:25
  #5 (permalink)  
Antiguo 26/05/2011, 12:00
 
Fecha de Ingreso: septiembre-2004
Ubicación: La Plata Argentina
Mensajes: 128
Antigüedad: 19 años, 7 meses
Puntos: 9
Respuesta: Validar Formulario con Javascript

Hola.

Si, OK. No habia visto que tambien consulta por el tipo del input en la funcion validateOnSubmit. Igual lo que te mande lo tienes que usar OK?

Para el checkbox, inserta esta linea

if(e.type=="checkbox" && e.name=="privacidad" && e.checked==0 ) invalid = true;

dentro de la funcion validateOnSubmit, dentro del for i

Saludos
  #6 (permalink)  
Antiguo 27/05/2011, 04:27
Avatar de ramiguens  
Fecha de Ingreso: mayo-2011
Mensajes: 57
Antigüedad: 12 años, 11 meses
Puntos: 4
Respuesta: Validar Formulario con Javascript

Lo he puesto asi pero me envia igual el formulario y no me colorea el checkbox, muchas gracias por la respuesta lamento las molestias y valoro mucho tu esfuerzo

function validateOnSubmit()
{
var invalid = false;
for(var i=0; i < this.elements.length; i++)
{
var e = this.elements[i];
if(e.type == "text" || e.type == "password")
{
if(e.type=="checkbox" && e.name=="privacidad" && e.checked==0 ) invalid = true;
{
if (e.onchange == validateOnChange)
{
e.onchange();
if (e.className == "invalid") invalid = true;
}
}
}
}
if(invalid)
{
alert('Campos obligatorios sin cubrir, rellene los campos en rojo y acepte los términos y condiciones.');
return false;
}
}
  #7 (permalink)  
Antiguo 27/05/2011, 08:24
 
Fecha de Ingreso: septiembre-2004
Ubicación: La Plata Argentina
Mensajes: 128
Antigüedad: 19 años, 7 meses
Puntos: 9
Respuesta: Validar Formulario con Javascript

Hola.

La insertaste en una linea incorrecta. Deberia ser :

Código Javascript:
Ver original
  1. function validateOnSubmit() {
  2.   var invalid = false;
  3.   for(var i=0; i < this.elements.length; i++) {
  4.     var e = this.elements[i];
  5.     if(e.type == "text" || e.type == "password") {
  6.       if (e.onchange == validateOnChange) {
  7.         e.onchange();
  8.         if (e.className == "invalid") invalid = true;
  9.       }
  10.     }
  11.         if(e.type=="checkbox" && e.name=="privacidad" && e.checked==0 ) invalid = true;
  12.   }
  13.   if(invalid) {
  14.     alert('invalido');
  15.     return false;
  16.   }
  17. }

Saludos
  #8 (permalink)  
Antiguo 27/05/2011, 09:37
Avatar de ramiguens  
Fecha de Ingreso: mayo-2011
Mensajes: 57
Antigüedad: 12 años, 11 meses
Puntos: 4
Respuesta: Validar Formulario con Javascript

Que mala es la ignorancia, jejejej, funciono, muchas gracias.

Etiquetas: formulario
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 21:23.