Tabelas em PHP com cores alternadas

[Jefferson Saavedra 0]

Bom pessoal vou postar aqui algo simples mas muito útil para quem está começando em php e deseja um efeito profissional. Uma tabela gerada a partir de um banco de dados com os resultados dispostos com cores alternadas nas linhas. Bom vamos lá.

 

Criação da tabela cadastro

 

CREATE TABLE cadastro (

id INT(11) NOT NULL auto_increment,

nome TEXT NOT NULL,

email VARCHAR(30) NOT NULL,

telefone VARCHAR(15) NOT NULL,

PRIMARY KEY (id));

 

Arquivo config.php(conexão com o banco de dados)

<?php

$host = "localhost";

$user = "root";//Digite o usuario
$pass = "vertrigo";//Digite a senha
$base = "cadastro";//Digite o nome do banco de dados

$conexao = mysql_connect($host, $user, $pass);
$banco = mysql_select_db($base)or die ("Não foi possível selecionar o Banco de dados.");

?>

Arquivo tabela.php(Arquivo que mostrará a tabela em sí)

<?php

include("config.php");//Aqui chamamos o arquivo de configuração com o banco de dados

$sql = "SELECT * FROM `cadastro` ORDER BY `nome`";//Instrução Select ao banco de dados

$query = mysql_query($sql);//Aqui executamos a consulta

$c = 2;
$cores = array("#CCCCCC","#FFFFFF");

while($linha = mysql_fetch_array($query)){//Aqui iniciaremos o loop que lerá o banco e posicionará o valor na tabela

       $nome = $linha['nome'];

       $email = $linha['email'];

       $telefone = $linha['telefone']


       $index = $c % 2;
       $c++;
       $cor = $cores[$index];

       $tabela = '<table width="100%" border="0" cellspacing="0" cellpadding="5">';
       $tabela .=  '<tr bgcolor="'.$cor.'">';
       $tabela .='<td width="10%"><div align="left">'.$matricula.'</div></td>';
       $tabela .='<td width="80%"><div align="left">'.$aluno.'</div></td>';
       $tabela .='<td width="10%"><div align="left">'.$nota.'</div></td>';
       $tabela .='</tr>';
       $tabela .='</table>';
       echo $tabela;

}

?>

Essa dica eu postei originalmente no blog http://www.blog.jspinformatica.com.br

Bom pessoal é isso aí. Qualquer coisa é só comentar.

[William Bruno 1501]

essa atribuição aqui, é despropositada e sem necessidade:

$nome = $linha['nome'];

       $email = $linha['email'];

       $telefone = $linha['telefone']

só tome cuidado ao postar 'tutoriais', pois qndo alguém está iniciando, acaba comentendo os mesmos erros que você, por não entender oque foi feito.

 

e cadê esse array aqui? $cor = $cores[$index]; ?

 

essa chamada consecutiva ao echo, é lenta.

[Jefferson Saavedra 0]

essa atribuição aqui, é despropositada e sem necessidade:

$nome = $linha['nome'];

       $email = $linha['email'];

       $telefone = $linha['telefone']

só tome cuidado ao postar 'tutoriais', pois qndo alguém está iniciando, acaba comentendo os mesmos erros que você, por não entender oque foi feito.

 

e cadê esse array aqui? $cor = $cores[$index]; ?

 

essa chamada consecutiva ao echo, é lenta.

 

Realmente eu havia esquecido de colocar o array valeu por somar já está editado no post inclusive a saida echo repetitiva.

[William Bruno 1501]

ainda faltou arrumar a atribuição desnecessária ^_^

 

e os nomes das variáveis não batem.

$tabela .='<td width="10%"><div align="left">'.$linha['matricula'].'</div></td>';

[Jefferson Saavedra 0]

ainda faltou arrumar a atribuição desnecessária ^_^

 

e os nomes das variáveis não batem.

$tabela .='<td width="10%"><div align="left">'.$linha['matricula'].'</div></td>';

kkk realmente foi pq eu tirei de um boletim online que estou desenvolvendo para um cliente vou arrumar e posto em baixo valeu.

[Jefferson Saavedra 0]

Criação da tabela cadastro

 

CREATE TABLE cadastro (

id INT(11) NOT NULL auto_increment,

nome TEXT NOT NULL,

email VARCHAR(30) NOT NULL,

telefone VARCHAR(15) NOT NULL,

PRIMARY KEY (id));

 

Arquivo config.php(conexão com o banco de dados)

<?php

$host = "localhost";

$user = "root";//Digite o usuario
$pass = "vertrigo";//Digite a senha
$base = "cadastro";//Digite o nome do banco de dados

$conexao = mysql_connect($host, $user, $pass);
$banco = mysql_select_db($base)or die ("Não foi possível selecionar o Banco de dados.");

?>

Arquivo tabela.php(Arquivo que mostrará a tabela em sí)

<?php

include("config.php");//Aqui chamamos o arquivo de configuração com o banco de dados

$sql = "SELECT * FROM `cadastro` ORDER BY `nome`";//Instrução Select ao banco de dados

$query = mysql_query($sql);//Aqui executamos a consulta

$c = 2;
$cores = array("#CCCCCC","#FFFFFF");

while($linha = mysql_fetch_array($query)){//Aqui iniciaremos o loop que lerá o banco e posicionará o valor na tabela

$index = $c % 2;
$c++;
$cor = $cores[$index];

$tabela = '<table width="100%" border="0" cellspacing="0" cellpadding="5">';
$tabela .= '<tr bgcolor="'.$cor.'">';
$tabela .= '<td width="10%"><div align="left">'.$linha['nome'].'</div></td>';
$tabela .= '<td width="80%"><div align="left">'.$linha['email'].'</div></td>';
$tabela .= '<td width="10%"><div align="left">'.$linha['telefone'].'</div></td>';
$tabela .= '</tr>';
$tabela .= '</table>';

echo $tabela;

}

?>

Bom. Acho que agora é isso valeu pelas observações às vezes faço na pressa e termino não prestando atenção nos detalhes. Até.

[William Bruno 1501]

bacana ^_^

segue outra versão:

 

<?php

	$mysqli = new mysqli('localhost','root','123','ajax');
	$sql = "SELECT `id`, `nome`, `email`, `telefone` 
		FROM `cadastro` ORDER BY `nome`";

	$query = $mysqli->query( $sql ) or die( $mysqli->error );


	$tabela = '<table style="width:100%; border: none;">';
	$tabela .= '<thead><tr><th>Nome</th><th>Email</th><th>Telefone</th></tr></thead><tbody>';
	$i=0;
	while( $dados = $query->fetch_object() )
	{
		$cor = ( $i%2 == 0 ) ? ' style="background: #ccc"' : '';
		$tabela .= '<tr'.$cor.'>';
		$tabela .= '<td width="10%">'.$dados->nome.'</td>';
		$tabela .= '<td width="80%">'.$dados->email.'</td>';
		$tabela .= '<td width="10%">'.$dados->telefone.'</td>';
		$tabela .= '</tr>';
		$i++;
	}
		
	$tabela .= '</tbody></table>';
	echo $tabela;

não percebi antes, mas criar a tabela dentro do loop é 'errado' nesse caso.

Afinal você só precisa de uma tabela com várias linhas, e não várias tabelas(uma para cada linha).

e o echo pode deixar fora do loop, se não, não tem muito sentido.

[Jefferson Saavedra 0]

Criação da tabela cadastro

 

CREATE TABLE cadastro (

id INT(11) NOT NULL auto_increment,

nome TEXT NOT NULL,

email VARCHAR(30) NOT NULL,

telefone VARCHAR(15) NOT NULL,

PRIMARY KEY (id));

 

Arquivo config.php(conexão com o banco de dados)

<?php

$host = "localhost";

$user = "root";//Digite o usuario
$pass = "vertrigo";//Digite a senha
$base = "cadastro";//Digite o nome do banco de dados

$conexao = mysql_connect($host, $user, $pass);
$banco = mysql_select_db($base)or die ("Não foi possível selecionar o Banco de dados.");

?>

Arquivo tabela.php(Arquivo que mostrará a tabela em sí)

<?php

include("config.php");//Aqui chamamos o arquivo de configuração com o banco de dados

$sql = "SELECT * FROM `cadastro` ORDER BY `nome`";//Instrução Select ao banco de dados

$query = mysql_query($sql);//Aqui executamos a consulta

$c = 2;
$cores = array("#CCCCCC","#FFFFFF");

$tabela = '<table width="100%" border="0" cellspacing="0" cellpadding="5">';

while($linha = mysql_fetch_array($query)){//Aqui iniciaremos o loop que lerá o banco e posicionará o valor na tabela

    $index = $c % 2;
    $c++;
    $cor = $cores[$index];
    $tabela .= '<tr bgcolor="'.$cor.'">';
    $tabela .= '<td width="50%"><div align="left">'.$linha['nome'].'</div></td>';
    $tabela .= '<td width="40%"><div align="left">'.$linha['email'].'</div></td>';
    $tabela .= '<td width="10%"><div align="left">'.$linha['telefone'].'</div></td>';
    $tabela .= '</tr>';
}
$tabela .= '</table>';
echo $tabela;
?>

Opa! se alguém tiver mais opiniões postem aí. Gostei de postar no fórum pois além de ajudar aprendemos mais do que somente perguntando.

[William Bruno 1501]

Olhe novamente o meu código, e preste atenção no que eu disse nesse trecho abaixo:

não percebi antes, mas criar a tabela dentro do loop é 'errado' nesse caso.

Afinal você só precisa de uma tabela com várias linhas, e não várias tabelas(uma para cada linha).

 

Veja o teu HTML gerado, e você vai entender.. terá vários <table></table> que não deveriam estar lá..

rode o meu código e compare a diferença.

[Jefferson Saavedra 0]

Veja o teu HTML gerado, e você vai entender.. terá vários <table></table> que não deveriam estar lá..

rode o meu código e compare a diferença.

 

Acho que te entendi editei no post anterior veja lá se está certo aqui eu testei e ficou realmente melhor agora. Eu havia feito direto no post da próxima eu testo antes de postar. Valeu mesmo fica a dica.

[PABLOSR 0]

opa, gostei pra caramba do efeito ae da tabela\o

mais queria saber com faria para deixar uma fonte padrão e tamanho, o que teria q adicionar ao código?

[Jaime_Pinheiro 0]

Olá, pessoal.

 

Sou novo aqui e este é meu primeiro post. Gostaria de sugerir uma outra possibilidade simples em OOP.

 

Visto que o tópico trata de estilizar uma tabela em cores alternadas, como um "grid", sugiro a seguinte implementação:

 

lib/Cycle.php

/**
* Classe de loops cíclicos
* 
* Utilizada para estilos em grids
*/
class Cycle implements Iterator
{
/**
 * Array de valores a serem loopados
 * @var array $cycles
 */
private $cycles;

/**
 * Constroi objeto
 * @param string $value_1
 * @param string $value_2 [optional],...
 */
function __construct()
{
	//Assinala argumentos passados como array
	$this->cycles = func_get_args();
}

/**
 * Expressa ciclo como string
 */
function __toString()
{
	return strval($this->fetch());
}

/**
 * Retorna ciclo atual e passa para o próximo.
 * @return mixed $cycle ciclo atual
 */
function fetch()
{
	$cycle = $this->current();
	if (!$this->next()) $this->rewind();
	return $cycle;
}

// Seção Iterator

function current()
{
	return current($this->cycles);
}

function key()
{
	return key($this->cycles);
}

function next()
{
	return next($this->cycles);
}

function rewind()
{
	return reset($this->cycles);
}

function valid()
{
	return isset($this->cycles[$this->key()]);
}
}

 

Uma demonstração simples de utilização

index.php

require_once dirname(__FILE__)."/lib/Cycle.php";

$style = new Cycle("white","green");

for ($i=0; $i<10; $i++)
{
echo "<p>$style</p>";
}

[Jaime_Pinheiro 0]

Utilizando o mesmo exemplo sugerido pelo autor, ficaria assim:

 

...
require_once dirname(__FILE__)."/lib/Cycle.php";
$style = new Cycle("#CCCCCC","#FFFFFF");
?>

<table width="100%" border="0" cellspacing="0" cellpadding="5">
<tr>
	<th>Nome</th>
	<th>E-mail</th>
	<th>Telefone</th>
</tr>
<?php while($line = mysql_fetch_assoc($query)):?>
<tr bgcolor="<?=$style?>">
	<td><?=$line["nome"]?></td>
	<td><?=$line["email"]?></td>
	<td><?=$line["telefone"]?></td>
</tr>
<?php endwhile;?>
</table>

[WM _ Guilherme Ferrolli 0]

<?php
$conecta = mysql_connect("servidor","usuario","suasenha");
$basedados = mysql_select_db("cadastro");



$sql = mysql_query("SELECT * FROM `suatabela`.`usuario` ");
$cont  = mysql_num_rows($sql);

while ($row = mysql_fetch_array($sql)) 
{
$cont = 0;

if ($cont % 2 == 0)
{
$cor = "#eeeeee";
}
else
{
$cor = "#ffffff";
}
echo '<tr bgcolor="'.$cor.'">';
echo "<td>".$row['nome']."</td>";
echo "<td>".$row['nome']."</td>";
echo "</tr>";

$cont = $cont + 1;
}
?>

acho que asim é bem mais fácil não é ;)

abraços