Tabla (alternando colores de celdas)

Danicnv · #1 (**permalink**) 05/02/2013, 13:17

Buenas soy nuevo en el foro. Llevo pocos días con el PHP, y me a surgido una duda.
He creado una tabla de 40 números, de 4 columnas por 10 filas.
Cada fila muestra en otra celda mas el resultado de su suma, y a la vez tambien se muestran las sumas de cada columna.
Hasta aqui a ido bien, a base de mucho esfuerzo, pero el problema ha llegado cuando me piden que le de color en modo ajedrez.

Os dejo una imagen de como lo tengo con su código.
Espero que se entienda bien.

<html>
<head>

</head>
<body>
<?php

$var=1;
$sum=0;
$columna1=0;
$columna2=0;
$columna3=0;
$columna4=0;

echo "<table width=300 border=2 align=center>";

echo "<tr>";
while ($var<=40)
{

echo "<td>$var</td>";

$sum=$sum+$var;

if ($var%4==0)
{
echo "<td>=$sum</td>";
echo "</tr><tr>";
$sum=0;
}

if ($var%4==1)
{
$columna1=$columna1+$var;
}

if ($var%4==2)
{
$columna2=$columna2+$var;
}

if ($var%4==3)
{
$columna3=$columna3+$var;
}
if ($var%4==0)
{
$columna4=$columna4+$var;
}

$var=$var+1;
}
echo "</tr>";

echo "<tr>";
echo "<td>";
echo $columna1;
echo "</td>";
echo "<td>";
echo $columna2;
echo "</td>";
echo "<td>";
echo $columna3;
echo "</td>";
echo "<td>";
echo $columna4;
echo "</td>";
echo "</tr>";
echo "</table>";
?>
</body>
</html>

Y esta tabla sería la que quiero conseguir:

Danicnv · #2 (**permalink**) 05/02/2013, 13:24

Me acabo de dar cuenta que el codigo no ha salido indexado.
Por si acaso interpreto un poco la idea:

Con esta parte lo que se consigue es que en la cuarta columna (los numeros multiplos de 4) pinte una suma, cierre y abra la fila, y vuelva a poner la suma a cero para que pase a la siguiente fila.

if ($var%4==0)
{
echo "<td>=$sum</td>";
echo "</tr><tr>";
$sum=0;
}

Y luego para hacder las sumas por columnas, como cada columna es multiplo de un numero diferente, lo he aprovechado y he hecho la misma operacion que con las filas, pero las he pintado aparte.

Estoy seguro que esto es muy simple para cualquier persona que lleve un tiempo con php pero para mi es un mundo jejej.
Un saludo y gracias de antemano

carlosdurannet · #3 (**permalink**) 05/02/2013, 16:30

Hola Danicnv. La verdad es que tu tabla, aunque tiene una apariencia sencilla, tiene cierta complejidad. Aquí te dejo el código explicado para poder usar el número final y el número de columnas que quieras:

Código PHP:

 
<html> 
    <head> 
        <title>Test PHP</title> 
        <style type="text/css"> 
            table, tr, td{ 
                border: 1px solid #000; 
            } 
            .color1{ 
                background-color: #ddd; 
                color: #333; 
            } 
            .color2{ 
                background-color: #aaa; 
                color: #000; 
            } 
        </style> 
    </head> 
    <body> 
        <table> 
            <tr> 
                <?php 
                $firstIndex = 1; // Controla el fondo de la primera celda de cada fila 
                $actualIndex = 1; // Controla el fondo de cada celda 
                $columnsNumber = 4; // Establece el número de columnas 
                $lastNumber = 42; // Establece el último numero del contador 
                $sumaFila = 0; // Contiene la suma de los numero de una fila 
                $columnIndex = 1; // Controla el número de columna (para utilizarla 
                // como índice en el array de suma de Columnas) 
// Con este for inicializamos un array que almacena la suma 
// de los números de cada columna 
                for ($iter = 1; $iter <= $columnsNumber; $iter++) { 
                    $sumaColumnas[$iter] = 0; 
                } 
 
                for ($iter = 1; $iter <= $lastNumber; $iter++) { 
 
                    echo $iter % $columnsNumber == 1 ? "<tr>" : ""; 
 
                    // Mientras no sea la última columna 
                    if ($iter % $columnsNumber != 0) { 
                        // Muestra el número actual 
                        echo '<td class="color' . $actualIndex . '">' . $iter . '</td>'; 
                        // Alterna el índice para el fondo entre 1 y 2 
                        $actualIndex = $actualIndex == 1 ? 2 : 1; 
                        // Suma el número del contador a la suma de la fila 
                        $sumaFila += $iter; 
                        // Suma el número del contador a la suma de la columa 
                        $sumaColumnas[$columnIndex] += $iter; 
                        // Suma 1 al contador 
                        $columnIndex++; 
 
                        // Si es la última columna 
                    } else { 
                        // Suma el número del contador a la suma de la fila 
                        $sumaFila += $iter; 
                        // Suma el número del contador a la suma de la columa 
                        $sumaColumnas[$columnIndex] += $iter; 
                        // Generamos la última celda de fila para el contador 
                        echo '<td class="color' . $actualIndex . '">' . $iter . '</td>'; 
                        // Generamos la celda del resultado de la suma de fila 
                        echo '<td>' . $sumaFila . '</td>'; 
                        // Cerramos la columna 
                        echo "</tr>"; 
                        // Alternamos el índice del fondo de la primera celda 
                        // Si la anterior era 1, ahora es 2 y viceversa 
                        $firstIndex = $firstIndex == 1 ? 2 : 1; 
                        // Le asignamos el mismo valor al índice que controla 
                        // el fondo de todas las celdas 
                        $actualIndex = $firstIndex; 
                        // Reiniciamos el índice de la columna a 1 
                        $columnIndex = 1; 
                        // Vaciamos la suma de fila 
                        $sumaFila = 0; 
                    } 
                } 
// Si al terminar el contador la fila no tiene celdas suficientes 
// la rellenamos con celdas en blanco 
                while ($columnIndex > 1) { 
                    echo "<td>&nbsp;</td>"; 
                    if ($columnIndex % $columnsNumber == 0) { 
                        echo "<td>&nbsp;</td></tr>"; 
                        $columnIndex = 1; 
                    } else { 
                        $columnIndex++; 
                    } 
                } 
// Finalmente generamos la fila con los resultados de las 
// sumas de cada una de las columnas 
                echo "<tr>"; 
                for ($iter = 1; $iter <= $columnsNumber; $iter++) { 
                    echo "<td>" . $sumaColumnas[$iter] . "</td>"; 
                } 
                echo "<td>&nbsp;</td></tr>"; 
                ?> 
        </table> 
    </body> 
</html>

Espero que te valga. Un saludo y ánimo.

dashtrash · #4 (**permalink**) 05/02/2013, 16:43

Por dios..qué complicación..

Código PHP:

Ver original//$arr=array(array(2,3,4,5),array(6,7,8,9),array(10,11,12,13));
$arr=array(array(2,3,4,5,9),array(6,7,8,9,10),array(10,11,12,13,21));
// Se cuenta el numero de columnas
$n=count($arr[0]);
// Este offset sirve para evitar que , al cambiar de fila, una celda negra quede
// bajo otra negra.Esto ocurre si el numero de columnas es par.
$off= (($n+1)%2);
 
$cells=0;
// Se preparan los estilos.Esto deberian ser clases css..
$styles=array('background-color:white;color:black','background-color:black;color:white');
echo "<table border=1>";
for($k=0;$k<count($arr);$k++) /* Primer for, que itera por filas */
{
      echo "<tr>";
      for($j=0;$j<count($arr[$k]);$j++,$cells++) /* segundo for, que itera por cada celda de la fila */
      
              echo "<td style=\"".$styles[$cells%2]."\">".$arr[$k][$j]."</td>";      
     $cells+=$off;
}

pateketrueke · #5 (**permalink**) 05/02/2013, 16:45

Pero igual todo esto se puede hacer únicamente con CSS3, ¿o no?

dashtrash · #6 (**permalink**) 05/02/2013, 16:54

Modificado para que sume las filas y columnas, que es lo único que igual es más complicado con CSS3.. (aparte, es más para que se vea la lógica del asunto)

Código PHP:

Ver original//$arr=array(array(2,3,4,5),array(6,7,8,9),array(10,11,12,13));
$arr=array(array(2,3,4,5,9),array(6,7,8,9,10),array(10,11,12,13,21));
// Se cuenta el numero de columnas
$n=count($arr[0]);
// Este offset sirve para evitar que , al cambiar de fila, una celda negra quede
// bajo otra negra.Esto ocurre si el numero de columnas es par.
$off= ($n%2);
 
$cells=0;
// Se preparan los estilos.Esto deberian ser clases css..
$styles=array('background-color:white;color:black','background-color:black;color:white');
echo "<table border=1>";
$colSums=array();
 
for($k=0;$k<count($arr);$k++) /* Primer for, que itera por filas */
{
      $rowSum=0;
      echo "<tr>";
      for($j=0;$j<count($arr[$k])-1;$j++,$cells++) /* segundo for, que itera por cada celda de la fila */      
     {
              $rowSum+=$arr[$k][$j];
              echo "<td style=\"".$styles[$cells%2]."\">".$arr[$k][$j]."</td>";      
                  $colSums[$j]+=$arr[$k][$j];
      }
      // El ultimo valor del array debe ser el total.
     echo "<td style=\"".$styles[0]."\">".$rowSum."</td></tr>";            
     $cells+=$off;
}
echo "<tr><td style=\"".$styles[0]."\">".implode("</td><td style=\"".$styles[0]."\">",$colSums)."</td></tr>";
echo "</table>";

Danicnv · #7 (**permalink**) 06/02/2013, 15:05

Muchisimas gracias por la ayuda, los dos ejemplos me han venido muy bien.

El de carlosdurannet lo entiendo mejor, aunque el de dashtrash me viene bien tambien para ir aprendiendo cosillas

Tengo un pequeño problema dashtrash en el segundo codigo que me has puesto más completo en la fila 22.

dashtrash · #8 (**permalink**) 06/02/2013, 17:42

Qué problema?