Tabla que se muestra u oculta al pulsar un link

Hurgui · #1 (**permalink**) 14/02/2005, 10:07

Hola,
se que este es un tema muy trillado (lo siento) pero es que he encontrado algunos códigos y no consigo adaptarlos justo a lo que quiero, ¿y que quiero? pues muy sencillo:

Un link normal y corriente que cuando le pulsas hace que sea visible una tabla que hay más abajo y cuando lo vuelves a pulsar se oculte.
Debajo de esa tabla hay contenido y necesito que este suba o baje en función de si esta visible la tabla.

Por si no ha quedado claro os ilustro con este croquis.

----------------------
HIPERVINCULO
----------------------
CONTENIDO
----------------------

<<<===>>>

----------------------
HIPERVINCULO
----------------------
TABLA
----------------------
CONTENIDO
----------------------

MUCHAS GRACIAS

erlingfiallos · #2 (**permalink**) 14/02/2005, 10:18

Yo hize algo parecido.. pero tome un ejemplo de una libreria hecha por los desarrolladores de Delphi.. si conoces algo sobre JavaScript puedo pasarte todo el ejemplo completo que hize para mi aplicacion..

JavierB · #3 (**permalink**) 14/02/2005, 10:24

Hola Hurgui

Supongamos que tienes esto:

<a href="#" onclick="mostrar(this);return false">Ocultar</a>
<table id="tabla">

Podrías usar este código:

Código PHP:

  function mostrar(enlace) {

  obj=document.getElementById('tabla');

  if(obj.style.display=='none') {

    obj.style.display='';

    enlace.innerHTML='Ocultar';

  }

  else {

    obj.style.display='none';

    enlace.innerHTML='Mostrar';

  }

}

Saludos,

Hurgui · #4 (**permalink**) 14/02/2005, 10:34

Consigo que funcione! pero como puedo hacer que inicialmente la tabla este oculta?

SALUDOS

Hurgui · #5 (**permalink**) 14/02/2005, 11:02

He resuelto lo de que empiece en invisible poniendo:

Código:

<body onload="mostrar(this);return false">

seguro que existe una forma más elegante de resolverlo (me gustaría saberla), pero así parece que funciona.

SALUDOS

JavierB · #6 (**permalink**) 14/02/2005, 11:20

Hola de nuevo.

Esto te podría servir:

<a href="#" onclick="mostrar(this);return false">Mostrar</a>
<table id="tabla" style="display:none">

Saludos,

Hurgui · #7 (**permalink**) 14/02/2005, 11:24

Ya sabía yo que habría una forma más elegante de hacerlo, muchisimas gracias por la ayuda

SALUDOS

AlexWeb · #8 (**permalink**) 14/02/2005, 11:32

Saludos Hurgui!

Hay otra forma de hacer lo que propones, y por lo que veo es la que más de moda está :p pero requiere el uso de frames, y no se si es precisamente lo que buscas. Se trata de construir una función de JavaScript que hace cada vez que la llamas, y en función de los parámetros que le pases, vacía el marco en cuestión (document.clear) y vuelve a dibujar la tabla usando document.write(...); Es una buena solución también, pero depende de si te gusta usar frames o no...

ALEX

Hurgui · #9 (**permalink**) 15/02/2005, 08:15

Había visto soluciones de ese tipo pero es que los frames no me van mucho, mientras pueda hacer las cosas con tablas y scripts lo prefiero.

SALUDOS