Formulario: ocultar un campo al seleccionar otro

J.ke · #1 (**permalink**) 07/05/2007, 16:55

Hola compañer@s,

Estoy preparando un formulario con este aspecto:

El campo de la izquierda se llama correo y tiene 2 posibles valores:
» si
» no

El campo de la derecha se llama correo_por y tiene otros 2 posibles valores:
» Por correo ordinario
» Por correo electrónico

Me gustaría que el campo de la derecha quede oculto si se selecciona a la izquierda la opción de no recibir correspondencia (y que vuelva a aparecer si se selecciona la opción de sí recibir correspondencia).

Imagino que se podrá conseguir con un javascript que diga algo parecido a esto (no me maten por lo que voy a escribir

)...

if correo=no{correo_por type="hidden"}
else{correo_por type="visible"}

Evidentemente no tengo ningún conocimiento de javascript, he hecho pruebas copiando trozos de códigos que encuentro por tutoriales pero al no saber como debo redactarlo no consigo que funcione.

Les agradecería mucho que pudieran ayudarme, adjunto el código completo:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Formulario</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div align="center"> 
  <form action="mailto:[email protected]" method="post" name="socio" id="socio" enctype="text/plain">
    <table width="500" border="1" cellpadding="5" cellspacing="0">
      <tr>
        <td width="25"><input name="correo" type="radio" value="si" checked></td>
        <td width="300">Deseo recibir correspondencia</td>
        <td><select name="correo_por" size="1" id="select">
            <option value="correo_ordinario" selected>Por correo ordinario</option>
            <option value="correo_electronico">Por correo electr&oacute;nico</option>
          </select></td>
      </tr>
      <tr>
        <td width="25"><input type="radio" name="correo" value="no"></td>
        <td width="300">No deseo recibir correspondencia</td>
      </tr>
    </table>
  </form>
</div>
</body>
</html>

Un saludo y gracias anticipadas

zick · #2 (**permalink**) 07/05/2007, 18:08

Amigo:

Intenta probar con el siguiente codigo:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Formulario</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div align="center"> 
  <form action="mailto:[email protected]" method="post" name="socio" id="socio" enctype="text/plain">
    <table width="500" border="1" cellpadding="5" cellspacing="0">
      <tr>
        <td width="25"><input name="correo" type="radio" value="si" onclick="if(this.checked){document.socio.correo_por.style.visibility = 'visible';}"></td>
        <td colspan="2">Deseo recibir correspondencia  
          <select name="correo_por" size="1" id="select" style="visibility:hidden">
            <option value="correo_ordinario" selected>Por correo ordinario</option>
            <option value="correo_electronico">Por correo electr&oacute;nico</option>
                  </select></td>
      </tr>
      <tr>
        <td width="25"><input type="radio" name="correo" value="no" onclick="if(this.checked){document.socio.correo_por.style.visibility = 'hidden';}"></td>
        <td width="300">No deseo recibir correspondencia</td>
      </tr>
    </table>
  </form>
</div>
</body>
</html>

Por cierto.. tienes que considerar que el formulario aunque lo envies.. igual te dará el valor del combobox, ya que con el codigo lo unico que haces es ocultarlo, de ningun modo lo invalidas asi es que ten cuidado si lo vas a usar asi..

Espero poder haberte ayudado..

Zick Corporation®
Creando soluciones a su medida

J.ke · #3 (**permalink**) 07/05/2007, 18:42

Genial Zick

Funciona a la perfección

No hay problema porque llegue al e-mail el valor del combobox oculto, cuando vea que el valor de correo es = no, no haré caso del valor que tenga correo_por.

Muchísimas gracias

(la magia de Internet, gente que no te conoce de nada echándote un cable cuando lo necesitas)