Foros del Web » Programando para Internet » Javascript »

ocultar divs desde un check box de una tabla html

Estas en el tema de ocultar divs desde un check box de una tabla html en el foro de Javascript en Foros del Web. hola buen dia. primo muestro lo que tengo y despues describo lo que necesito HTML @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código HTML: Ver original < table id = ...
  #1 (permalink)  
Antiguo 01/05/2014, 18:11
 
Fecha de Ingreso: octubre-2012
Mensajes: 202
Antigüedad: 11 años, 6 meses
Puntos: 0
ocultar divs desde un check box de una tabla html

hola buen dia. primo muestro lo que tengo y despues describo lo que necesito

HTML
Código HTML:
Ver original
  1. <table id="resultado">
  2.                         <tr>
  3.                             <th>Ver</th>
  4.                             <th>Id</th>
  5.                             <th>Codigo</th>
  6.                             <th>Descripcion</th>
  7.                             <th>Familia</th>
  8.                             <th>Marca</th>
  9.                             <th>Precio</th>
  10.                         </tr>
  11.                         <!--FIN CABECERA TABLA-->
  12.                         <tbody>
  13.                             <tr>
  14.                                 <!--Ejemplos-->
  15.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  16.                                 <td>1</td>
  17.                                 <td>1600</td>
  18.                                 <td>Heladera con freezer blanca 328 Lts, Alt:  166cm - Ancho:   63cm - Prof:  62cm</td>
  19.                                 <td>Refrigeracion</td>
  20.                                 <td>Bambi</td>
  21.                                 <td>5400</td>
  22.                             </tr>
  23.                             <tr>
  24.                                 <!--Ejemplos-->
  25.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  26.                                 <td>2</td>
  27.                                 <td>4100</td>
  28.                                 <td>Frezzer 4100 litros</td>
  29.                                 <td>Refrigeracion</td>
  30.                                 <td>Bambi</td>
  31.                                 <td>7100</td>          
  32.                             </tr>
  33.                             <tr>
  34.                                 <!--Ejemplos-->
  35.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  36.                                 <td>3</td>
  37.                                 <td>280</td>
  38.                                 <td>Heladera 280 litros</td>
  39.                                 <td>Refrigeracion</td>
  40.                                 <td>Neba</td>
  41.                                 <td>3800</td>          
  42.                             </tr>
  43.                             <tr>
  44.                                 <!--Ejemplos-->
  45.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  46.                                 <td>4</td>
  47.                                 <td>SAS5500</td>
  48.                                 <td>Televisor 42" smart</td>
  49.                                 <td>Televisores</td>
  50.                                 <td>Samasung</td>
  51.                                 <td>8100</td>          
  52.                             </tr>
  53.                             <tr>
  54.                                 <!--Ejemplos-->
  55.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  56.                                 <td>5</td>
  57.                                 <td>SAS5500</td>
  58.                                 <td>Televisor 42" smart</td>
  59.                                 <td>Televisores</td>
  60.                                 <td>Samasung</td>
  61.                                 <td>8100</td>          
  62.                             </tr>
  63.                             <tr>
  64.                                 <!--Ejemplos-->
  65.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  66.                                 <td>6</td>
  67.                                 <td>SAS5500</td>
  68.                                 <td>Televisor 42" smart</td>
  69.                                 <td>Televisores</td>
  70.                                 <td>Samasung</td>
  71.                                 <td>8100</td>          
  72.                             </tr>
  73.                             <tr>
  74.                                 <!--Ejemplos-->
  75.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  76.                                 <td>7</td>
  77.                                 <td>SAS5500</td>
  78.                                 <td>Televisor 42" smart</td>
  79.                                 <td>Televisores</td>
  80.                                 <td>Samasung</td>
  81.                                 <td>8100</td>          
  82.                             </tr>
  83.                             <tr>
  84.                                 <!--Ejemplos-->
  85.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  86.                                 <td>8</td>
  87.                                 <td>4100</td>
  88.                                 <td>Frezzer 4100 litros</td>
  89.                                 <td>Refrigeracion</td>
  90.                                 <td>Bambi</td>
  91.                                 <td>7100</td>          
  92.                             </tr>
  93.                             <tr>
  94.                                 <!--Ejemplos-->
  95.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  96.                                 <td>9</td>
  97.                                 <td>280</td>
  98.                                 <td>Heladera 280 litros</td>
  99.                                 <td>Refrigeracion</td>
  100.                                 <td>Neba</td>
  101.                                 <td>7200</td>
  102.                             </tr>  
  103.                             <tr>
  104.                                 <!--Ejemplos-->
  105.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  106.                                 <td>9</td>
  107.                                 <td>SAS5500</td>
  108.                                 <td>Televisor 42" smart</td>
  109.                                 <td>Televisores</td>
  110.                                 <td>Samasung</td>
  111.                                 <td>8100</td>          
  112.                             </tr>
  113.                             <tr>
  114.                                 <!--Ejemplos-->
  115.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  116.                                 <td>10</td>
  117.                                 <td>4100</td>
  118.                                 <td>Frezzer 4100 litros</td>
  119.                                 <td>Refrigeracion</td>
  120.                                 <td>Bambi</td>
  121.                                 <td>7100</td>          
  122.                             </tr>
  123.                             <tr>
  124.                                 <!--Ejemplos-->
  125.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  126.                                 <td>11</td>
  127.                                 <td>280</td>
  128.                                 <td>Heladera 280 litros</td>
  129.                                 <td>Refrigeracion</td>
  130.                                 <td>Neba</td>
  131.                                 <td>7200</td>
  132.                             </tr>
  133.                             <tr>
  134.                                 <!--Ejemplos-->
  135.                                 <td><input type="checkbox" name="check" id="check" value="1" onchange="javascript:mostrarContenido()" /></td>
  136.                                 <td>12</td>
  137.                                 <td>SAS5500</td>
  138.                                 <td>Televisor 42" smart</td>
  139.                                 <td>Televisores</td>
  140.                                 <td>Samasung</td>
  141.                                 <td>8100</td>          
  142.                             </tr>                      
  143.                         </tbody>
  144.                         <!--FIN CONTENIDO TABLA-->
  145.                     </table>

JAVASCRIPT

Código Javascript:
Ver original
  1. //Mostrar el contenido de la visualizacion del producto
  2. function mostrarContenido() {
  3.     oculto = document.getElementById("oculto");
  4.     alerta= document.getElementById("alerta");
  5.     error= document.getElementById("error");
  6.     advertencia= document.getElementById("advertencia");
  7.     check = document.getElementById("check");
  8.    
  9.     if (check.checked) {
  10.         oculto.style.display='block';
  11.         alerta.style.display='block';
  12.         advertencia.style.display='none';
  13.     }
  14.     else {
  15.         advertencia.style.display='block';
  16.         oculto.style.display='none';
  17.         alerta.style.display='none';
  18.     }
  19. }

ESTO ME FUNCIONA PERFECTO. PERO SOLO CON EL PRIMER LINK
LO QUE YO NECESITARIA ES QUE EL ID Y EL NOMBRE DE CADA INPUT SE VALLA INCREMENTANDO A MEDIDA QUE SE ENCUENTRE UNA NUEVA FILA Y DE ALGUNA MANERA DECIR COMO JAVACRIPT QUE ESTA RESPONDIENDO A ESA FILA. PORQUE AHORA EL CHECK BOX RESPONDE SIEMPRE AL MISMO DIV CON EL MISMO CONTENIDO

ESPERO RESPUESTA GRACIAS!!
  #2 (permalink)  
Antiguo 01/05/2014, 21:09
Avatar de Franz1628  
Fecha de Ingreso: marzo-2007
Ubicación: Lima - Perú
Mensajes: 145
Antigüedad: 17 años, 1 mes
Puntos: 26
Respuesta: ocultar divs desde un check box de una tabla html

Amigo pon todo el código HTML, porque falta
__________________
En mi Blog puedes ver articulos javascript y más...
@Franz1628

Etiquetas: box, divs, funcion, html, input, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:45.