Foros del Web » Programando para Internet » Javascript »

no se como buscar alguna pista!

Estas en el tema de no se como buscar alguna pista! en el foro de Javascript en Foros del Web. tengo el siguiente problema: Quiero mostrar una tabla con un cliente por fila, y en la linea siguiente a la de cada cliente, tener oculta ...
  #1 (permalink)  
Antiguo 20/02/2004, 22:00
 
Fecha de Ingreso: marzo-2002
Ubicación: Rosario, Argentina
Mensajes: 20
Antigüedad: 22 años, 1 mes
Puntos: 0
no se como buscar alguna pista!

tengo el siguiente problema:
Quiero mostrar una tabla con un cliente por fila, y en la linea siguiente
a la de cada cliente, tener oculta una tabla con el detalle de los datos
del mismo.
La idea era que haciendo click en cualquier parte de la fila de cada cliente
muestre (haga visible) sus datos y oculte los datos del cliente anteriormente
mostrardo (si lo habia)

el problema es que intente hacer algo pero como no tengo mucha idea de
scripts, no se como hacerlo.

La idea era que para identificar la tabla de detalles del cliente, pueda
usar algun nombre mas el "id" del cliente, y de esa manera hacer alguna
funcion que sea generica, ya que puede tener varios clientes en mi tabla.

Si alguien se da cuenta que estoy haciendo mal (puede que todo este mal),
les agradeceria que me ayuden
Ojo, estoy leyendo manuales pero no se como buscar esto especificamente.

<html>
<head>
<title>Mantenimiento Codigos Clientes</title>

<STYLE type=text/css>
.normal {background-color:'#E8ECE8';}
.resaltado {background-color:'#FFCC66';}
.ocultar {visibility:'hidden';}
.mostrar {visibility:'visible';}
</STYLE>

<SCRIPT LANGUAGE="VBScript">
Dim pIDANT
Dim pID
pIDANT = 0
Sub CambiarColor (pID)
If pIDANT = "" Then
"lincliente" + pIDANT + ".classname" = "normal"
"sicliente" + pIDANT + ".classname" = "ocultar"
End If
"lincliente" + pID + ".classname" = "resaltado"
"sicliente" + pID + ".classname" = "mostrar"
pIDANT = pID
End Sub
</script>


</head>

<body>
<div align="center">
<center>
<table border="1" cellpadding="0" width="565">
<tr>
<td width="502" colspan="4"><b>Clientes</b></td>
</tr>
<tr>
<td width="52"><b>Codigo</b></td>
<td width="319"><b>Descripcion</b></td>
<td width="63"><b>Usuario</b></td>
<td width="73"><b>Modificar</b></td>
</tr>

<!-- comienza linea del cliente .................................................. ............... -->
<div id="lincliente1" class="normal">
<tr>
<td onclick="call CambiarColor (1)" width="52">12345</td>
<td width="319">juan perez</td>
<td width="63">DCDF</td>
<td width="73">BORRAR/MODIFICAR</td>
</tr>
</div>
<!-- comienza sistemas instalados del cliente .................................................. ......... -->
<div id="sicliente1" class="ocultar">
<tr>
<td width="59">&nbsp;</td>
<td width="500" colspan="3">
<table border="1" cellpadding="0" cellspacing="1" width="558" height="58">
<tr>
<td width="558" height="26" colspan="6"><b>Sistemas
Instalados</b></td>
</tr>
<tr>
<td width="70" height="18"><b>Codigo</b></td>
<td width="93" height="18"><b>Nombre</b></td>
<td width="73" height="18"><b>Version</b></td>
<td width="54" height="18"><b>Multi</b></td>
<td width="85" height="18"><b>FechaInsta</b></td>
<td width="163" height="18"><b>Modifica/Borra</b></td>
</tr>
<tr>
<td width="70" height="14">S1231XX$codsis</td>
<td width="93" height="14">NEMESIS</td>
<td width="73" height="14">1.01</td>
<td width="54" height="14">MULTIUSUARIO</td>
<td width="85" height="14">13/02/1971</td>
<td width="163" height="14">modiBorra</td>
</tr>
</table>
</div>
</td>
</tr>

</table>
</center>
</div>
</body>
</html>
  #2 (permalink)  
Antiguo 21/02/2004, 16:43
Avatar de derkenuke
Colaborador
 
Fecha de Ingreso: octubre-2003
Ubicación: self.location.href
Mensajes: 2.665
Antigüedad: 20 años, 6 meses
Puntos: 45
Te he hecho el trabajo duro, te he ordenado el codigo y le he añadido un par de ejemplos mas, para que veas como funciona. A lo mejor te interesa la aplicacion de "clases" si tienes muchos clientes, eso va de tu mano:

Código PHP:

<html>
<
head>
<
title>Mantenimiento Codigos Clientes</title>

<
STYLE type=text/css>
.
normal background-color:'#E8ECE8'cursor:hand; }
.
resaltado background-color:'#FFCC66'cursor:hand; }
.
oculto display:none; }
.
mostrado display:block; }
</
STYLE>

<
script language="javascript">
<!--

var 
idsClientes=new Array("cliente1","cliente2","cliente3","cliente4");

function 
desmarcarTodos() {
    for(
a=0;a<idsClientes.length;a++) {
        
document.getElementById("lin"+idsClientes[a]).className='normal';
        
document.getElementById("si"+idsClientes[a]).className='oculto';
    }
}

function 
marcar(idCliente) {
    
estaMarcado=document.getElementById("lin"+idCliente).className=="resaltado";
    
desmarcarTodos();
    if(!
estaMarcado) {
        
desmarcarTodos();
        
document.getElementById("lin"+idCliente).className='resaltado';
        
document.getElementById("si"+idCliente).className='normal';
    }
}
//-->
</script>


</head>

<body>

<center>
<table border="1" cellpadding="0" width="630">
    <tr>
        <td width="502" colspan="4"><b>Clientes</b></td>
    </tr>
    <tr>
        <td width="52"><b>Codigo</b></td>
        <td width="319"><b>Descripcion</b></td>
        <td width="63"><b>Usuario</b></td>
        <td width="73"><b>Modificar</b></td>
    </tr>
<!-- comienza linea del cliente cliente 1................................................................. -->
    <tr class="normal" id="lincliente1" onclick="marcar('cliente1')">
        <td width="52">12345</td>
        <td width="319">juan perez</td>
        <td width="63">DCDF</td>
        <td width="73">BORRAR/MODIFICAR</td>
    </tr>
<!-- fin de la linea cliente cliente1 .................................................................... -->
    <!-- comienza sistemas instalados del cliente cliente1 ........................................................... -->
    <tr id="sicliente1" class="oculto">
        <td> &nbsp;</td>
        <td width="500" colspan="3">
            <table border="1" cellpadding="0" cellspacing="1" width="558" height="58">
                <tr>
                    <td width="558" height="26" colspan="6"><b>Sistemas Instalados</b></td>
                </tr>
                <tr>
                    <td width="70" height="18"><b>Codigo</b></td>
                    <td width="93" height="18"><b>Nombre</b></td>
                    <td width="73" height="18"><b>Version</b></td>
                    <td width="54" height="18"><b>Multi</b></td>
                    <td width="85" height="18"><b>FechaInsta</b></td>
                    <td width="163" height="18"><b>Modifica/Borra</b></td>
                </tr>
                <tr>
                    <td width="70" height="14">S1231XX$codsis</td>
                    <td width="93" height="14">NEMESIS</td>
                    <td width="73" height="14">1.01</td>
                    <td width="54" height="14">MULTIUSUARIO</td>
                    <td width="85" height="14">13/02/1971</td>
                    <td width="163" height="14">modiBorra</td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- fin de sistemas instalados del cliente cliente1 ........................................................... -->
<!-- comienza linea del cliente cliente 2................................................................. -->
    <tr id="lincliente2" class="normal" onclick="marcar('cliente2')">
        <td width="59"> 1234</td>
        <td width="500">paco</td>
        <td>DEGA</td>
        <td>BORRAR/MODIFICAR</td>
    </tr>
<!-- fin de la linea cliente cliente2 .................................................................... -->
    <!-- comienza sistemas instalados del cliente cliente2 ........................................................... -->
    <tr id="sicliente2" class="oculto">
        <td> &nbsp;</td><td colspan="3">
            <table border="1" cellpadding="0" cellspacing="1" width="558" height="58" id="table1">
                <tr>
                    <td width="558" height="26" colspan="6"><b>Sistemas Instalados</b></td>
                </tr>
                <tr>
                    <td width="70" height="18"><b>Codigo</b></td>
                    <td width="93" height="18"><b>Nombre</b></td>
                    <td width="73" height="18"><b>Version</b></td>
                    <td width="54" height="18"><b>Multi</b></td>
                    <td width="85" height="18"><b>FechaInsta</b></td>
                    <td width="163" height="18"><b>Modifica/Borra</b></td>
                </tr>
                <tr>
                    <td width="70" height="14">S1231XX$codsis</td>
                    <td width="93" height="14">NEMESIS0</td>
                    <td width="73" height="14">1.013</td>
                    <td width="54" height="14">MULTIUSUARIO</td>
                    <td width="85" height="14">13/02/1971</td>
                    <td width="163" height="14">modiBorra</td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- fin de sistemas instalados del cliente cliente2 ........................................................... -->
<!-- comienza linea del cliente cliente 3................................................................. -->
    <tr id="lincliente3" class="normal" onclick="marcar('cliente3')">
        <td> 4252</td><td>patan</td>
        <td>FEAS</td>
        <td>BORRAR/MODIFICAR</td>
    </tr>
<!-- fin de la linea cliente cliente3 .................................................................... -->
    <!-- comienza sistemas instalados del cliente cliente3 ........................................................... -->
    <tr id="sicliente3" class="oculto">
        <td width="59"> &nbsp;</td>
        <td colspan="3">
            <table border="1" cellpadding="0" cellspacing="1" width="558" height="58" id="table2">
                <tr>
                <td width="558" height="26" colspan="6"><b>Sistemas Instalados</b></td>
                </tr>
                <tr>
                <td width="70" height="18"><b>Codigo</b></td>
                <td width="93" height="18"><b>Nombre</b></td>
                <td width="73" height="18"><b>Version</b></td>
                <td width="54" height="18"><b>Multi</b></td>
                <td width="85" height="18"><b>FechaInsta</b></td>
                <td width="163" height="18"><b>Modifica/Borra</b></td>
                </tr>
                <tr>
                <td width="70" height="14">S1231XX$codsis</td>
                <td width="93" height="14">NEMESIS2</td>
                <td width="73" height="14">3.01</td>
                <td width="54" height="14">MULTIUSUARIO</td>
                <td width="85" height="14">13/02/1971</td>
                <td width="163" height="14">modiBorra</td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- fin de sistemas instalados del cliente cliente3 ........................................................... -->
<!-- comienza linea del cliente cliente 4................................................................. -->
    <tr id="lincliente4" class="normal" onclick="marcar('cliente4')">
        <td width="59"> 23423</td>
        <td width="500">cliente ultimo</td><td>XXRA</td><td>BORRAR/MODIFICAR</td>
    </tr>
<!-- fin de la linea cliente cliente4 .................................................................... -->
    <!-- comienza sistemas instalados del cliente cliente4 ........................................................... -->
    <tr id="sicliente4" class="oculto">
        <td width="59"> &nbsp;</td>
        <td colspan="3">
            <table border="1" cellpadding="0" cellspacing="1" width="558" height="58" id="table3">
                <tr>
                    <td width="558" height="26" colspan="6"><b>Sistemas Instalados</b></td>
                </tr>
                <tr>
                    <td width="70" height="18"><b>Codigo</b></td>
                    <td width="93" height="18"><b>Nombre</b></td>
                    <td width="73" height="18"><b>Version</b></td>
                    <td width="54" height="18"><b>Multi</b></td>
                    <td width="85" height="18"><b>FechaInsta</b></td>
                    <td width="163" height="18"><b>Modifica/Borra</b></td>
                </tr>
                <tr>
                    <td width="70" height="14">S1231XX$codsis</td>
                    <td width="93" height="14">NEMESIS3</td>
                    <td width="73" height="14">5.01</td>
                    <td width="54" height="14">NO</td>
                    <td width="85" height="14">13/02/1971</td>
                    <td width="163" height="14">modiBorra</td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- fin de sistemas instalados del cliente cliente4 ........................................................... -->
</table>
</center>

</body>
</html> 


creo que esta todo bien, a mi me ha funcionado.

Un saludo
__________________
- Haz preguntas inteligentes, y obtendrás más y mejores respuestas.
- Antes de postearlo Inténtalo y Búscalo.
- Escribe correctamente tus mensajes.
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 17:39.