Ver Mensaje Individual
  #5 (permalink)  
Antiguo 11/03/2012, 16:44
panchompc
 
Fecha de Ingreso: diciembre-2011
Ubicación: Chile
Mensajes: 36
Antigüedad: 12 años, 5 meses
Puntos: 2
Respuesta: ¿Como ocultar algunas filas de una tabla?

Hola!,
Al final lo hice con Jquery :

Lo dejo para otros posibles interesados

Lo que hice:

1º Ponerle class=captionRow a los <tr> que queria esconder, quedando de esta manera: <tr id="captionRow">

2º crear 2 <div> que funcionan como botones, declarando 2 clases nuevas (ocultar/mostrar)

Código HTML:
Ver original
  1. <div class="mostrar">Mostrar más campos</div><div class="ocultar">Ocultar </div>

el CSS de los div

Código CSS:
Ver original
  1. .mostrar { height:25px; cursor:pointer; float:left; margin-left:5px;}
  2. .ocultar { height:25px; cursor:pointer; float:left; margin-left:5px;}

3º Controlar los display y las acciones con jQuery:

Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.     //escondo elementos
  3.  $(".captionRow").hide();//escondo los elementos de la tabla
  4.  $(".ocultar").hide();//escondo el boton 'ocultar'
  5.  
  6.     //MOSTRAR El RESTO DE TABLA
  7.  $(".mostrar").click(function(){
  8.      $(".captionRow").show("slow");//muestro resto de la tabla
  9.      $(".ocultar").show();//muestro el boton 'Ocultar'
  10.      $(".mostrar").hide();//escondo el boton 'Mostrar'
  11.      
  12.      });
  13.  
  14.     //OCULTAR EL RESTO DE LA TABLA
  15.  $(".ocultar").click(function(){
  16.      $(".captionRow").hide("slow");//escondo el resto de la tabla
  17.      $(".ocultar").hide();//escondo el boton 'Ocultar'
  18.      $(".mostrar").show();//muestro el botom 'Mostrar'
  19.      });
  20. });

De todas maneras, MUCHAS GRACIAS a todos por las ayudas y sugerencia, deje en favoritos el doc. sobre BOM para leerlo con calma en la semana :)