Como mostrar/ocultar filas de una tabla, según List/Menu

flaviovich · #1 (**permalink**) 29/08/2005, 12:10

Hola!
Tengo un combobox:

Código HTML:

<select name="combo1" size="1">
           <option value="1" selected>Opcion 1</option>
           <option value="2">Opcion 2</option>
</select>

dentro de una tabla.
Necesito mostrar unas unos objetos (checkbox, text, label, etc.) según lo elegido.
Por ejemplo, al seleccionar Opcion 2, se muestra 1 fila de la tabla.
Me dijeron que se deben usar capas. Estuve leyendo sobre esto, pero me parecio algo complicado. Si alguien tiene algun ejemplo parecido, o conoce algun site con ejemplos de algo parecido a lo que necesito, le estare muy agradecido.

nuevo · #2 (**permalink**) 29/08/2005, 12:21

mira a ver si te sirve

Código PHP:

  <html> 
<head> 
<title>Mostrar/ocultar filas y columnas</title> 
<style type="text/css"> 
table {border-collapse:collapse;border:1px solid maroon;margin-left:80px} 
td {border:1px solid maroon;width:30px;text-align:center} 
input {background:silver; border:1px solid maroon;width:100px;margin:5px} 
</style> 
<script type="text/javascript"> 
<!-- 
function ocultarFila(num,ver) { 
dis=ver?'':'none'; 
tab=document.getElementById('tabla'); 
tab.getElementsByTagName('tr')[num].style.display=dis; 
} 
function ocultarColumna(num,ver) { 
dis= ver?'':'none'; 
fila=document.getElementById('tabla').getElementsByTagName('tr'); 
for(i=0;i<fila.length;i++) 
fila[i].getElementsByTagName('td')[num].style.display=dis; 
} 
--> 
</script> 
</head> 
<body> 
 
<table id="tabla" border="1"><tr><td></td></tr></table> 
 
<input type="button" value="Quitar fila" onclick="ocultarFila(1,false)"> 
<input type="button" value="Poner fila" onclick="ocultarFila(1,true)"> 
<br> 
<input type="button" value="Quitar columna" onclick="ocultarColumna(1,false)"> 
<input type="button" value="Poner columna" onclick="ocultarColumna(1,true)"> 
</body> 
</html>

flaviovich · #3 (**permalink**) 29/08/2005, 15:30

Muchas gracias "nuevo"!
Era justo lo que necesitaba

Solo que habia un error, pero ya lo corregi.
Aquí esta el codigo corregido

Código:

<html>
<head>
<title>Mostrar/ocultar filas y columnas</title>
<style type="text/css">
table {border-collapse:collapse;border:1px solid maroon;margin-left:80px}
td {border:1px solid maroon;width:30px;text-align:center}
input {background:silver; border:1px solid maroon;width:100px;margin:5px}
</style>
<script type="text/javascript">
<!--
function ocultarFila(num,ver) {
dis=ver?'':'none';
tr=document.getElementById('tabla').getElementsByTagName('tr')[num];
tr.style.display=dis;
}
function ocultarColumna(num,ver) {
dis= ver?'':'none';
fila=document.getElementById('tabla').getElementsByTagName('tr');
for(i=0;i<fila.length;i++)
fila[i].getElementsByTagName('td')[num].style.display=dis;
}
-->
</script>
</head>
<body>

<table id="tabla" border="1">
	<tr>
		<td>hola</td><td>mundo</td><td>bello</td>
	</tr>
	<tr>
		<td>adios</td><td>mundo</td><td>cruel</td>
	</tr>
	<tr>
		<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
	</tr>
</table>

<input type="button" value="Quitar fila" onclick="ocultarFila(2,false)">
<input type="button" value="Poner fila" onclick="ocultarFila(2,true)">
<br>
<input type="button" value="Quitar columna" onclick="ocultarColumna(1,false)">
<input type="button" value="Poner columna" onclick="ocultarColumna(1,true)">
</body>
</html>

Ojala que a alguien le sirva tambien!