como mostrar y ocultar dependiendo del select

shembao · #1 (**permalink**) 30/09/2008, 07:11

holas ... quiisiera saber como ocultar y mostrar una table dependiendo del select (en este caso si elige fecha se debe desplegar la tabla oculta) ... este es el codigo que tengo ... trate de hacerlo con css y xDisplay pero nada ...
a ver si me ayudan ... gracias

Código:

<head>
<script>
function expandir_formulario(){
if (document.busca.opcion.selected==3){
   xDisplay('capaexpansion', 'block')
}else{
   xDisplay('capaexpansion', 'none')
}
} 
</script>
</head>

<body>

elseif($op==2){ ?>
    <h2>Consultas</h2>
    <br/>

    <br/>
    <form name="busca" method="post" action="formulario.php?op=2">
	<table width="80%" height="30" border="0" cellspacing="1">
      <tr valign="top">
          <td width="8%">Buscar</td>
          <td width="25%"><input type="text" name="buscar" size="30" /></td>
          <td width="5%"></td>
          <td width="62%" >

            <select name="opcion">
              <option value="0">&nbsp;</option>
              <option value="1" >Nro. Contenedor</option>
              <option value="2" >Nro. Documento</option>
              <option value="3" onclick="expandir_formulario()">Fecha</option>
            </select>
			
            <input type="submit" name="Button1" value="Ir" />
          </td>        
      </tr>
    </table>
    <br/>
   <div id=capaexpansion> 
      <table id="fecha"  width="66%" border="0" cellspacing="0">
        <tr>
          <td width="9%"> Inicio </td>
          <td width="36%"><input type="text" id="inicio" name="inicio"/>
            <button id="buttoninicio" >...</button></td>
          <td width="6%">Fin </td>
          <td width="39%"><input type="text" id="fin" name="fin"/>
            <button id="buttonfin"  >...</button></td>
        </tr>
    </table>

<body>

ahora si tieben otras sugerencias ,,, = sirven ... gracias

David · #2 (**permalink**) 30/09/2008, 13:06

Se puede hacer usando getElementById para obtener el div y cambiar su style.display por el valor que se necesite (oculto/bloque). El tema de mostrar/ocultar ha sido tratado muchas veces en el foro de Javascript, puedes hacer una búsqueda por allá que seguro encontrarás.

P.S.: El evento onclick de los option no se produce en la mayoría de los navegadores, mejor usa el evento onchange del select.

shembao · #3 (**permalink**) 30/09/2008, 13:08

Cita:

Iniciado por David el Grande

Se puede hacer usando getElementById para obtener el div y cambiar su style.display por el valor que se necesite (oculto/bloque). El tema de mostrar/ocultar ha sido tratado muchas veces en el foro de Javascript, puedes hacer una búsqueda por allá que seguro encontrarás.

ok voy a revisar ... ojala resulte
despues comento que ocurrio