Ver Mensaje Individual
  #1 (permalink)  
Antiguo 17/12/2012, 10:52
jhosefus
 
Fecha de Ingreso: diciembre-2007
Mensajes: 2
Antigüedad: 16 años, 4 meses
Puntos: 0
Sobreponer Divs generados Automaticamente

Muy buenas comunidad, tengo un problema que espero me puedan ayudar. Tengo que ir cargando dinámicamente DIVs de acuerdo a como se vayan cargando datos en enlaces de la siguiente manera:

Código HTML:
   {section name=ind loop=$datosCompra}
    <div id="estado{$datosCompra[ind].id_estado}">
        <table align="center" border="0">
            <tr>                                
                <td width="300" height="45">Fecha de Inicio: <span style="color: gray;">{$datosCompra[ind].fecha_proceso}</span></td>
            </tr>
            <tr>                                
                <td height="45">Persona: <span style="color: gray;">{$datosCompra[ind].usuario_proceso}</span></td>
            </tr>
            <tr>                                
                <td height="45">Cantidad de D&iacute;as: <span style="color: gray;">{$dias[ind]}</span></td>
            </tr>
            <tr>                                
                <td height="45">Fecha de Salida: <span style="color: gray;">{$fecha_salida[ind]}</span></td>
            </tr>
        </table>        
    </div>
    {/section}

    <table id="listadoCompras" class="bordered" align="center">

    <tbody style="font-size:10px">
    {section name=indice loop=$datosCompra}
        <tr valign="middle">
            <td>
                <a href="#" onclick="cambiar_divs('{$datosCompra[indice].id_estado}');">Ver</a>
            </td>
        </tr>    
    {/section}
    </tbody>

    </table> 
y el script de Cambiar divs es la siguiente:

Código HTML:
    function cambiar_divs(capa_cambiable){
        for(i=0; i<=18; i++){
            var capas = 'estado' + i;
            if(document.getElementById(capas).style.display=='block'){
                document.getElementById(capas).style.display='none';
                document.getElementById(capa_cambiable).style.display='block';
            }
        }
    }
Lo que hace es mostrar inicialmente un DIV y ocultar todos los demas divs, lo que intento hacer es que al apretar en un enlace que se genera en una tabla, se oculte el div que se muestra al principio y se muestre otro, o que se pulse en otro lin y ese que está visible se oculte y otro se muestre y asi sucesivamente, cuando ejecuto ese ejemplo no me oculta los divs. Alguna idea o sugerencia para poder realizarlo de forma dinámica?.

Se me ocurre que tal vez se pueda con Jquery pero la verdad nose como podría hacerlo.
Gracias por sus respuestas.