Problemas con seleccion de ID en tablas

PP2 · #1 (**permalink**) 24/01/2008, 08:57

Tengo un problema, resulta que quiero cambiar el color de una celda de una tabla, eso ya lo puedo hacer pero quiero que cuando de clic en otra se cambie el color de la anterior y cambie a la nueva celda.

Para cambiar el color de una sola celda es:

Código PHP:

  echo 'bgcolor="#CCCCCC" class="contenido" onClick="m'.$idtb.'.style.backgroundColor=\'#697069\'"'

Pero si se dan cuenta el id empieza en todas las celdas con m, y de ahi es un numero pero no consecutivo, sino variable ya que lo tomo de la base de datos (tengo que hacerlo asi). Comento esto por que tambien pense en hacer un recorrido de los ids, pero son variables.
Aclaracion: no el onmouseout, y todos esos no puedo usarlos ya que requiere que se que se quede selecionado hasta que de clic en otro

Se me ocurre algo donde antes de hacer el cambio de color de la celda restablesca el color de todas las celdas que empiecen con "m". pero ese es el problema que no se como hacerlo

Les agradesco su ayuda.

JavierB · #2 (**permalink**) 24/01/2008, 09:24

Hola PP2

Te pongo un ejemplo que no necesita usar id, espero que te sirva:

Código PHP:

  <html>
<head>
<script type="text/javascript">
var celda = null;
function cambiar(obj) {
  obj.style.background = '#f00';
  if (celda) celda.style.background = '';
  celda = obj;
}
</script>
</head>
<body>
<table>
<tr>
<td onclick="cambiar(this)">Uno</td>
<td onclick="cambiar(this)">Dos</td>
<td onclick="cambiar(this)">Tres</td>
</tr>
</table>
</body>
</html>

Saludos,

tunait · #3 (**permalink**) 24/01/2008, 09:24

mmm podrías guardar el objeto (celda) en una variable global

Por ejemplo, al cargar el documento inicializas la variable con un valor de false

var celdaActiva = false;

Cuando se da click en una celda cambias el color de fondo, se lo cambias además a la celda que se activó antes y que estará guardada en la variable y finalmente guardas una referencia al objeto en la misma variable.

onclick="this.style.backgroundColor=\'#697069\'; if(celdaActiva) celdaActiva.style.backgroundColor=\'#CCCCCC\'; celdaActiva = this;"

Aunque para poner todo ese chorro de código en cada celda te va a pesar mucho el documento, podrías guardarlo todo en una función

Código:

function marcarCelda(celda){
        if(celdaActiva) celdaActiva.style.backgroundColor='#CCCCCC';
        celda.style.backgroundColor='#697069';
        celdaActiva = celda;
}

y a tus celdas llamas a la función en el onclick pasándose a sí mismas como parámetro (this)

un saludo

tunait · #4 (**permalink**) 24/01/2008, 09:25

iggh por diez segundos me ganaste Javier, pierdo facultades con los años