Validacion de formulario antes de enviarlo

iovan · #1 (**permalink**) 16/12/2008, 21:48

Buenas a todos amigos.

Para comenzar mi pregunta, soy nuevo y no entiendo muy bien el funcionamiento de JS, pero aqui estoy leyendo tutoriales y cursos para aprender.

Cita:

Por ahora estaba leyendo una parte de un curso en el que se muestra como validar formularios antes de mandar. Por ejemplo si hay campos de formularios vacios lanzar una alerta, si se escriben numeros en algun campo que no los permita lanzar una alerta, validar que una dreccion de email este correcta si no lanzar una alerta y etc...

De echo he practicado muchisimo este tema, y he fabricado el siguiente script:
http://foro.team-xo.net/pages/examples/3.html

Funciona perfectamente, solo lo muestro para que vean que no soy un usuario pidiendo que los demas hagan mi trabajo.

Pero se me presento una enorme pregunta.

Estoy validando campos de formulario tipo text y textarea, pero como puedo validar campos tipo checkbox, radio, select. Yahe experimentado todo el dia de ayer y la mitad de hoy y no lo consigo.

Si pudieran ser lo mas didacticos posibles, (Mostrando el JS y un ejemplo del forulario para poder usarlo)

Muchas muchas gracias.

caricatos · #2 (**permalink**) 16/12/2008, 23:45

Hola:

Creo que no has visto este enlace: El abc de los formularios... hay algunas validaciones básicas... sobre los radios y checkboxes hay que consultar su atributo checked, y los select es casi igual a los text (consultar su value)

Saludos

Fernand0 · #3 (**permalink**) 17/12/2008, 01:50

W3S

En el menu de la izquierda tenes el resto.. radio.. select... etc..
Ojea bien esa web desde el principio.. sirve bastante

iovan · #4 (**permalink**) 17/12/2008, 03:20

Muchas gracias a ambos, despues de muchos intetos y experimentos logre hacer el script para radio.

quedo asi:

Código:

function validar(formulario) { 
//validar radio
  if (formulario.radio.checked==false) {
      alert("Por favor verifique");
	  return (false);
	  }
 //enviar formulario si  se cumplen con las condicions	
  return (true);
}

Y el formulario

Código HTML:

<form method="post" onsubmit="return validar(this)">
  <input type="radio" name="radio"/>
  <input type="submit" value="Enviar" />
</form>

pero ahora tengo un problema, mi formulario donde quiero meter esto usa dos radios y los dos se tienen que llamar igual para que cuando seleccione un radio el otro se deseleccione

Código HTML:

<html>
<head>
<script>
function validar(formulario) { 
//validar radio
  if (formulario.radio.checked==false) {
      alert("Por favor verifique");
	  return (false);
	  }
 //enviar formulario si  se cumplen con las condicions	
  return (true);
}
</script>
</head>

<body>
<form method="post" onsubmit="return validar(this)">
  <input type="radio" name="radio"/>
  <input type="radio" name="radio"/>
  <input type="submit" value="Enviar" />
</form>
</body>
</html>

Pero no me funciona ya intente de muchas formas pero no me funciona.

Muchas gracias por la ayuda.

Fernand0 · #5 (**permalink**) 17/12/2008, 03:35

Diferenciar

Validacion

Acordate que tenes las FAQ's

iovan · #6 (**permalink**) 17/12/2008, 03:44

Muchas gracias. ya logre mi intencion con la ayuda de un usuario de este foro.

Muchas gracias.

Código HTML:

<html>
<head>
<script>
function validar(formulario) {
    for (var i=0; radio = formulario.radio[i]; i++)
    if (radio.checked) return; {
     alert('Has de selecionar al menos uno');
      return false;
}
 //enviar formulario si  se cumplen con las condicions	
  return (true);
}
</script>
</head>
<body>
<form method="post" onsubmit="return validar(this)">
  <input type="radio" name="radio"/>
  <input type="radio" name="radio"/>
  <input type="submit" value="Enviar" />
</form>
</body>
</html>

Pero ahora basandonos en mi script como puedo validar un select estube buscado en las faqs y utilizan un codigo muy largo que no se parece al que utilizo en mi script.

GRaciasssss.

Gracias.

Fernand0 · #7 (**permalink**) 17/12/2008, 04:19

Código javascript:

Ver originalif(document.getElementById("selectID").value=='elvalorquevosquieras') { ... }

Código HTML:

<select id="selectID" ....>....</select>

caricatos · #8 (**permalink**) 17/12/2008, 05:19

Hola:

A los controles de los formularios no es necesario asignarles un id para poder referenciarlos con javascript, basta con la referencia del formulario seguido de un punto y su atributo name.

Para casos de listados asignarles a cada elemento un id es algo complicado (no imposible)

Saludos

iovan · #9 (**permalink**) 17/12/2008, 13:32

Muchas gracias, ya me ha quedado.

Lo posteo por si ha alguien mas le sirve.

Código HTML:

<html>
<head>
<script>
function validar(formulario) {
if (formulario.menu.value=='novalue') {
    alert('Seleccione un valor');
    return (false);
  }
 //enviar formulario si  se cumplen con las condicions	
  return (true);
}
</script>
</head>

<body>
<form method="post" onSubmit="return validar(this)">
  <select name="menu">
    <option value="novalue">seleciona uno</option>
    <option value="uno">1</option>
    <option value="dos">2</option>
  </select>
  <input type="submit" value="Enviar" />
</form>
</body>
</html>