Ayuda con JavaScript (ocultar/mostrar al 95%)

[Waska]

Hola a tod@s!

Necesito vuestra ayuda, veréis, estoy haciendo una Web en cuyo contenido hay unn formulario.
El formulario es éste:

http://ub.freeiz.com/ub2/formulari.php

Como veréis, hay un javascript en los botones "afegir grup2", "afegir grup3" y "afegir grup4" que al hacer clic, se muestra una nueva tabla.

Lo que quiero hacer es que, cuando muestre la tabla del grupo 2 (por ejemplo), el icono "+" sea otro icono "-" y en vez de poner "afegir grup 2" ponga "ocultar grup 2".

¿Alguien podría echarme una mano?

Muchas gracias a tod@s :)

[_cronos2]

Creo que sería algo así:

Código Javascript:

mostrarOcultarTablas(id, enlace){
 var elem = document.getElementById(id);
 elem.style.display = (elem.style.display == 'none') ? 'block' : 'none';
 enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.jpg" />&nbsp;&nbsp;Ocultar grup 2';
}
 

Código HTML:

<a href="javascript:mostrarOcultarTablas('tabla1', this)"  style="text-decoration:none;"><img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2</a>
 

Saludos (:

[Waska]

Iniciado por _cronos2

Creo que sería algo así:

Código Javascript:

mostrarOcultarTablas(id, enlace){
 var elem = document.getElementById(id);
 elem.style.display = (elem.style.display == 'none') ? 'block' : 'none';
 enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.jpg" />&nbsp;&nbsp;Ocultar grup 2';
}
 

Código HTML:

<a href="javascript:mostrarOcultarTablas('tabla1', this)"  style="text-decoration:none;"><img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2</a>
 

Saludos (:

Buenas _cronos2 !!

Agradezco muchísimo tu ayuda! :D

He aplicado el JS que me has facilitado y lo he subido a:

http://ub.freeiz.com/ub2/formulari_20100906.php

He puesto como imagen ocultaboto.gif (está subida ya jejeje).

Lo que no sé por qué no se ve el "Ocultar grup 2", no lo visualiza al hacer clic en "Afegir grup 2".

Un saludo y mil gracias por anticipado ;)

[_cronos2]

No funciona porque yo puse ocultaboto.jpg y tú subiste ocultaboto.gif, o sea que sólo hay que modificar un poco el código:

Código Javascript:

mostrarOcultarTablas(id, enlace){
 var elem = document.getElementById(id);
 elem.style.display = (elem.style.display == 'none') ? 'block' : 'none';
 enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.gif" />&nbsp;&nbsp;Ocultar grup 2';
}
 

Saludos (:

[Waska]

Código:

function mostrarOcultarTablas(id,enlace){      
	var elem = document.getElementById(id);
	elem.style.display = (elem.style.display == 'none') ? 'block' : 'none';
	enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.gif" />&nbsp;&nbsp;Ocultar grup 2';
}

Sí que lo actualicé! xD Puse la nueva extensión en el código JS pero aún así, nada :_(

Por cierto, me mola el tema de tu nick! La de Iron Man está también muy bien.

Salu2 y gracias por anticipado ;)

[Waska]

Código Javascript:

function mostrarOcultarTablas(id,enlace){      
    var elem = document.getElementById(id);
    elem.style.display = (elem.style.display == 'none') ? 'block' : 'none';
    enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.gif" />&nbsp;&nbsp;Ocultar grup 2';
}
 

Sí que lo actualicé! xD Puse la nueva extensión en el código JS pero aún así, nada :_(

Por cierto, me mola el tema de tu nick! La de Iron Man está también muy bien.

Salu2 y gracias por anticipado ;)[/QUOTE]

[_cronos2]

Lo que pasaba era que no había que ponerlo en el href, sino en el onclick:

Código Javascript:

function mostrarOcultarTablas(id,enlace){      
 var elem = document.getElementById(id);
 elem.style.display = (elem.style.display == 'none') ? 'block' : 'none'; 
 enlace.innerHTML = (elem.style.display == 'none') ? '<img border="0" src="desplegaboto.jpg" />&nbsp;&nbsp;Afegir grup 2' : '<img border="0" src="ocultaboto.gif" />&nbsp;&nbsp;Ocultar grup 2';
}
 

Código HTML:

<a onclick="mostrarOcultarTablas('tabla1',this);" style="text-decoration:none;"><img border="0" src='desplegaboto.jpg' alt='oro' />&nbsp;&nbsp;Afegir grup 2</a>
 

El único problema es que ahora no tiene la apariencia de un enlace, pero con un poco de CSS se puede arreglar perfecamente.
Saludos (:

[Waska]

¿Problema? ¡Para nada!

Ahora está mucho mejor. Te agradezco mucho tu ayuda, cualquier cosa que vea que pueda realizar en este foro y en otros lenguajes no dudéis con que tendréis mi ayuda !!

Ahora está muy bien!

Enlace:

http://ub.freeiz.com/ub2/formulari.php

Un saludo y gracias ;)