[SOLUCIONADO] como alterno los colores de mi tabla?

ecosysonidos · #1 (**permalink**) 27/04/2013, 22:28

He visto en algunas paginas tablas con colores alternos, como puedo hacer esto si tengo mi tabla en php como resultado de mi consulta a mi base de datos

asi imprimo mi tabla

Código PHP:

   
$users=mysql_query("SELECT * from contratacion");

while ($row = mysql_fetch_array($users, MYSQL_ASSOC)) {

  echo '<table width="400" border="2" align="center" cellpadding="0" id="miTabla">';

                

                     echo '<tr>';

    echo '<td width="200">'.$row['Email'].'</td>';

 echo '<td width="200">'.$row['Nombre'].'</td>';

   

    echo '</tr>'; 

    

    echo '</table>';

    mysql_close($con);

}

y logro imprimirla correctamente solo quiero agregarle algo mas estetico, alguna idea o tema sobre el que deba investigar

Saludos

ironcrema · #2 (**permalink**) 27/04/2013, 23:14

Coloca un contador que empiece desde 1 y que se vaya incrementando a medida que imprimas una fila, mas una condicion que divida el contador entre 2 y si el residuo es cero imprima la fila con un color y si no que imprima con otro.

Saludos

cuasatar · #3 (**permalink**) 28/04/2013, 11:13

Con jquery lo puedes hacer mas facil:

Código Javascript:

Ver original$(document).ready(function() {
$('tr:odd').addClass('odd');
$('tr:even').addClass('even');
});

En las clases par e impar le colocas el color que tu quieras. Tambien se puede hacer con CSS3 pero no lo recuerdo bien, la unica pega de CSS3 es que de IE8 para atras no sirve. Si alguien sabe como se hace con CSS3 que por favor lo diga que lo he olvidado.

pateketrueke · #4 (**permalink**) 28/04/2013, 11:15

Pues con CSS3 es aún más fácil.

Código CSS:

Ver originaltbody tr:nth-child(odd) {
   background-color: #ccc;
}

patilanz · #5 (**permalink**) 28/04/2013, 11:17

Cita:

Iniciado por pateketrueke

Pues con CSS3 es aún más fácil.

Código CSS:

Ver originaltbody tr:nth-child(odd) {
   background-color: #ccc;
}

Hola, me puedes explicar como funciona el codigo osea esta parte: tbody tr:nth-child(odd)

pateketrueke · #6 (**permalink**) 28/04/2013, 11:19

Cita:

Iniciado por patilanz

Hola, me puedes explicar como funciona el codigo osea esta parte: tbody tr:nth-child(odd)

Hola, te sugiero consultar una referencia de CSS3.

cuasatar · #7 (**permalink**) 28/04/2013, 11:21

Cita:

Iniciado por patilanz

Hola, me puedes explicar como funciona el codigo osea esta parte: tbody tr:nth-child(odd)

http://www.spanish-translator-servic...7/evenodd.html

ecosysonidos · #8 (**permalink**) 06/06/2013, 09:42

Cita:

Iniciado por cuasatar

[url]http://www.spanish-translator-services.com/espanol/t/007/evenodd.html[/url]

ya lo resolví y con un while en php
saludos y gracias de cualquier manera

pateketrueke · #9 (**permalink**) 06/06/2013, 10:10

Cita:

Iniciado por ecosysonidos

ya lo resolví y con un while en php
saludos y gracias de cualquier manera

Al menos coloca la solución, no seas tan egoísta como para no compartirla.

wizanchez · #10 (**permalink**) 06/06/2013, 10:24

Cita:

Iniciado por ecosysonidos

He visto en algunas paginas tablas con colores alternos, como puedo hacer esto si tengo mi tabla en php como resultado de mi consulta a mi base de datos

asi imprimo mi tabla

Código PHP:

  
$users=mysql_query("SELECT * from contratacion");
while ($row = mysql_fetch_array($users, MYSQL_ASSOC)) {
  echo '<table width="400" border="2" align="center" cellpadding="0" id="miTabla">';
                
                     echo '<tr>';
    echo '<td width="200">'.$row['Email'].'</td>';
 echo '<td width="200">'.$row['Nombre'].'</td>';
   
    echo '</tr>'; 
    
    echo '</table>';
    mysql_close($con);
}

y logro imprimirla correctamente solo quiero agregarle algo mas estetico, alguna idea o tema sobre el que deba investigar

Saludos

- podrias hacerlo asi tambien

Código PHP:

Ver originalecho '<table width="400" border="2" align="center" cellpadding="0" id="miTabla">';
while ($row = mysql_fetch_array($users, MYSQL_ASSOC)) {
  
$v_color =$v_color==''?'RED':'';        
        
         echo '<tr bgcolor="'.$v_color.'">';
    echo '<td width="200">'.$row['Email'].'</td>';
 echo '<td width="200">'.$row['Nombre'].'</td>';
   
    echo '</tr>'; 
    
    echo '</table>';
    mysql_close($con);
}

- si es en jQuery como recomienda cuasatar, te recomiendo esta libreria para darle incluso ordenamiento a las grid, para que te metas realmente con el poder de jQuery

http://tablesorter.com/docs/

ecosysonidos · #11 (**permalink**) 06/06/2013, 10:52

Cita:

Iniciado por pateketrueke

Al menos coloca la solución, no seas tan egoísta como para no compartirla.

ok no te pongas

es que se puede hacer con un while o on for el chiste es recorrer la tabla y dependiendo de la posicion asignar un color, si lo encuentra el siguiente renglon se le asignara otro y al volver a iniciar compara oooooootra vez y etc etc

Código PHP:

Ver original$color="1";
    echo '<table>';
    echo "<tr bgcolor=#A9D0F5 align='center' class='xy'><td>Server</td><td aling=center>Usuario</td><td>IP</td>";
    echo "</tr>";
        for ($i=0; $i < count($ARRAY); $i++)
            {
                $regtable = $ARRAY[$i];
                    if($color==1){
                        echo "<tr bgcolor='#F0F0F0' align='center'>
                            <td>".$regtable['server']."</td><td>".$regtable['user']."</td><td>".$regtable['address']."</td></tr>";
                            $color="2";
                    }else{
                        echo "<tr bgcolor='#DEDEBE' align='center'>
                            <td>".$regtable['server']."</td><td>".$regtable['user']."</td><td>".$regtable['address']."</td></tr>";
                            $color="1";
                        }
 
            
            
            }#for
echo '</table>';

no es envidioso............ ahi esta el dato para quien le sirva

wizanchez · #12 (**permalink**) 06/06/2013, 10:58

Cita:

Iniciado por ecosysonidos

ok no te pongas

es que se puede hacer con un while o on for el chiste es recorrer la tabla y dependiendo de la posicion asignar un color, si lo encuentra el siguiente renglon se le asignara otro y al volver a iniciar compara oooooootra vez y etc etc

$color="1";
echo '<table>';
echo "<tr bgcolor=#A9D0F5 align='center' class='xy'><td>Server</td><td aling=center>Usuario</td><td>IP</td>";
echo "</tr>";
for ($i=0; $i < count($ARRAY); $i++)
{
$regtable = $ARRAY[$i];
if($color==1){
echo "<tr bgcolor='#F0F0F0' align='center'>
<td>".$regtable['server']."</td><td>".$regtable['user']."</td><td>".$regtable['address']."</td></tr>";
$color="2";
}else{
echo "<tr bgcolor='#DEDEBE' align='center'>
<td>".$regtable['server']."</td><td>".$regtable['user']."</td><td>".$regtable['address']."</td></tr>";
$color="1";
}

}#for
echo '</table>';

no es envidioso............ ahi esta el dato para quien le sirva

- te recomiendo que no repitas codigo mira mi comentario anterior o mejoralo asi

Código PHP:

Ver originalfor ($i=0; $i < count($ARRAY); $i++)
            {
    $b_color =$b_color=="F0F0F0"?'DEDEBE':'F0F0F0';
echo "<tr bgcolor='".$b_color."' align='center'>
             <td>".$regtable['server']."</td><td>".$regtable['user']."</td>
             <td>".$regtable['address']."</td>
         </tr>";
}

- algo mas sencillo en menos lineas de codigo
- no se que tan bueno sea meter todo el codigo HTML en echo PHP

ecosysonidos · #13 (**permalink**) 06/06/2013, 11:17

Cita:

Iniciado por wizanchez

- te recomiendo que no repitas codigo mira mi comentario anterior o mejoralo asi

Código PHP:

Ver originalfor ($i=0; $i < count($ARRAY); $i++)
            {
    $b_color =$b_color=="F0F0F0"?'DEDEBE':'F0F0F0';
echo "<tr bgcolor='".$b_color."' align='center'>
             <td>".$regtable['server']."</td><td>".$regtable['user']."</td>
             <td>".$regtable['address']."</td>
         </tr>";
}

- algo mas sencillo en menos lineas de codigo
- no se que tan bueno sea meter todo el codigo HTML en echo PHP

bien todo depende del uso, pero mejor entre menos lineas

saludos

wizanchez · #14 (**permalink**) 06/06/2013, 11:21

- te decia era porque no veo la necesidad de metere html en echo PHP, asi se demora un poco mas en la interpretacion y no saturas en interpretacion del codigo

ecosysonidos · #15 (**permalink**) 06/06/2013, 11:49

Cita:

Iniciado por wizanchez

- te decia era porque no veo la necesidad de metere html en echo PHP, asi se demora un poco mas en la interpretacion y no saturas en interpretacion del codigo

por eso te digo que depende del uso yo en mi caso mi pagina es en php

pateketrueke · #16 (**permalink**) 06/06/2013, 11:52

Cita:

Iniciado por ecosysonidos

por eso te digo que depende del uso yo en mi caso mi pagina es en php

¿Y qué tiene de malo que sea en PHP?

Perfectamente puedes usar HTML directamente sin tener que embeberlo en cadenas de PHP, y enseguida usar código PHP, es lo más común.

Código PHP:

Ver original<!-- BIEN --><?php if ($algo) { ?>
Acá pongo el HTML
<?php } ?>
 
<!-- MAL --><?php if ($algo) {
echo 'Acá pongo el HTML';
} ?>

Eso es básico, meter HTML en cadenas de texto es una terrible y mala practica, así que si nunca cambias tu forma de trabajar vas tener problemas por eso, te lo aseguro.

wizanchez · #17 (**permalink**) 06/06/2013, 11:53

- este es mi punto, que es lo mismo pero compilando menos el php

Código PHP:

Ver original<?PHp 
for ($i=0; $i < count($ARRAY); $i++)
            {
    $b_color =$b_color=="F0F0F0"?'DEDEBE':'F0F0F0';
?><tr bgcolor='<?PHp echo $b_color;?>' align='center'><?PHp
             <td><?PHp echo $regtable['server'];?></td>
             <td><?PHp echo $regtable['user'];?></td>
             <td><?PHp echo $regtable['address'];?></td>
         </tr><?PHp 
}

ecosysonidos · #18 (**permalink**) 06/06/2013, 18:46

jajaja never mind no todo el mundo es erudito uno que apenas va aprendiendo gracias por el consejo lo tomare en cuenta ------------> ja