Foros del Web » Programando para Internet » Javascript »

Valores de una fila

Estas en el tema de Valores de una fila en el foro de Javascript en Foros del Web. Hola necesito que al hacer click en una fila de una tabla, esta cambie de color (hasta aquí sin problema) y ademas me devuelva los ...
  #1 (permalink)  
Antiguo 09/10/2007, 14:55
 
Fecha de Ingreso: octubre-2007
Mensajes: 2
Antigüedad: 16 años, 6 meses
Puntos: 0
Pregunta Valores de una fila

Hola necesito que al hacer click en una fila de una tabla, esta cambie de color (hasta aquí sin problema) y ademas me devuelva los valores de las celdas de esa tabla, con el siguiente código me funciona en IE6 y Opera pero no en Firefox. Podéis Ayudarme ???
Gracias:

CODIGO:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="contactos.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
function selecciona(id){
if (document.getElementById){
//alert(id);
var ele=document.getElementById(id);
var filas = document.getElementsByTagName("tr");
//alert (filas.length);
for(var i=0; i<filas.length; i++) {
var fila = filas[i];
fila.style.backgroundColor = '#FFFFFF';
}
ele.style.backgroundColor = '#BBBBBB';

/*
alert(ele.childNodes[0].firstChild.nodeValue);
alert(ele.childNodes[1].firstChild.nodeValue);
alert(ele.childNodes[2].firstChild.nodeValue);
*/
for(var j=0; j < ele.childNodes.length; j++) {
//alert(j);
alert(ele.childNodes[j].firstChild.nodeValue);
}

}
}
</script>


</head>

<body class="oneColElsCtrHdr">

<div id="container">
<div id="header">
<h1>Header</h1>
<!-- end #header -->
</div>

<div id="mainContent" align="center">
<p>&nbsp;</p>
<table width="500" border="1" id="tablaid">

<tr id="tr1" onclick="selecciona('tr1')">
<td>a</td>
<td>b</td>
<td>c</td>
</tr>

<tr id="tr2" onclick="selecciona('tr2')">
<td>d</td>
<td>e</td>
<td>f</td>
</tr>

<tr id="tr3" onclick="selecciona('tr3')">
<td>g</td>
<td>h</td>
<td>i</td>
</tr>
</table>


<h1>&nbsp;</h1>
<!-- end #mainContent --></div>
<div id="footer">
<p>Footer</p>
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>
  #2 (permalink)  
Antiguo 09/10/2007, 15:56
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
Re: Valores de una fila

Hola ivanillo, bienvenido al foro:

A mi a veces tanto childNode me da un poco de miedo, nunca sabes si va a coger una etiqueta HTML o un nodo de texto en blanco (tabulaciones, espacios en el código...).

Lo que hago normalmente para navegar por nodos es utilizar un while y voy profundizando hasta que llego a la etiqueta que busco. Pero en este caso con coger todos los hijos TD creo que vale:

Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<
title>Untitled Document</title>

<
script type="text/javascript">
var 
anteriorFilaSeleccionada null;
function 
selecciona(fila){
    if( 
anteriorFilaSeleccionada )
        
anteriorFilaSeleccionada.style.backgroundColor '#FFFFFF';
    
fila.style.backgroundColor '#BBBBBB';
    
anteriorFilaSeleccionada fila;
    var 
celdasEnFila fila.getElementsByTagName("TD");
    for(var 
j=0j<celdasEnFila.lengthj++) {
        
alert(celdasEnFila[j].firstChild.nodeValue);
    }
}
</script>


</head>

<body>

<table width="500" border="1" id="tablaid">
    <tr onclick="selecciona(this)">
        <td>a</td>
        <td>b</td>
        <td>c</td>
    </tr>
    <tr onclick="selecciona(this)">
        <td>d</td>
        <td>e</td>
        <td>f</td>
    </tr>
    <tr onclick="selecciona(this)">
        <td>g</td>
        <td>h</td>
        <td>i</td>
    </tr>
</table>


</body>
</html> 
También te ahorrarás los id's y escribir argumentos utilizando el this. Te ahorras tiempo de ejecución (sobre todo en ordenadores lentos si hay muchas filas) si guardas la fila que acabas de colorear con anteriorFilaSeleccionada, así no tienes que recorrer todas las filas.



Lo he probado sólo en FF2 y en IE6, tendrás que probarlo en el resto.

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.
  #3 (permalink)  
Antiguo 14/10/2007, 03:56
 
Fecha de Ingreso: octubre-2007
Mensajes: 2
Antigüedad: 16 años, 6 meses
Puntos: 0
Re: Valores de una fila

OK
Gracias 1000
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 15:57.