Alternating Row Colors Help

jdotrose

This is what I have so far. I was able to output this data with a table within a loop. Looking for a little help with alternating row colors so my table doesn't look so dull, would html5 work? Ifso how would I implement it

echo "<table>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" .$row['firstname']. "</td><td>". $row['lastname']. "</td>";
echo "<td>" .$row['address']. "</td><td>". $row['city']. "</td>";
echo "<td>" .$row['state']. "</td>";
echo "<td>" .$row['zipcode']. "</td><td>". $row['phone1']. "</td>";
echo "<td>" .$row['phonenum']. "</td><td>". $row['email']. "</td>";
echo "<td>" .$row['day1']. "</td><td>". $row['day2']. "</td>";
echo "<td>" .$row['package']. "</td>";

echo "</tr>";

}

misheck

I am a newbie myself but give this a shot. Add this to your css file.

tr:nth-child(odd)		{ background-color:#eee; }
tr:nth-child(even)		{ background-color:#fff; }

misheck

You can also try this
css

.row0{
 background:white;
}
.row1{
 background:black;
}

And in php while printing rows (trs)

<?php

$i = 0;
foreach( ... ){

$i = 1-$i;
$class = "row$i";
?>
<tr class="<?php echo $class ?>">
...

rikmoncur

Ye olde fashioned way.

<?php 

echo '<table border="1">';

for( // for the following conditions
$i = 5; // set counter 
$i <= 10; // loop times
$i++ // do loop
)

{if ( $i % 2 == 1){ // modulus
$color = "red";
}
else
{
$color = "blue";
}
echo '<tr style="color:#ffffff; background-color:'.$color.' "><td>number is: ' . $i . '</td></tr>';
}

echo '</table>';

/* ******
Using an array: foreach loops through a block of code for each element of an array.

foreach(array as value)
{
do stuff
}
********** */
?>

and if your browser supports css3:
http://dhtmlexamples.com/2011/01/20/alternating-row-colors-in-a-table-in-html5/

jdotrose

This is my output

Kelly Mayes Hello 5654 Detroit Mi 48221 554-5555 jeffery@hello.com php java one
Jamie Fry Hello 5654 Detroit Mi 48221 554-5555 jeffery@hello.com html5 java two
Mary Stewart Hello 5654 Taylor Mi 48174 555-5555 jeffery@hello.com html5 java two
John Marts Hello 5654 Detroit Mi 4812 554-5555 jeffery@hello.com php c one
James Madison Hello Taylor Mi 48174 555-5555 jeffery@hello.com php c one
Evelyn Rose Hello 5654 Detroit Mi 48221 554-5555 jeffery@hello.com html5 java two

With the examples given, I'm unable to pass my variables into the tables
Where would I link the css to this table, when I try I get syntax errors. Or is there an easier way to set the first loop variables to Red, step the 2nd loop to Grey etc..

heres what I have below

<?php

// Make a MySQL Connection
mysql_connect("localhost", "**", "") or die(mysql_error());
mysql_select_db("**") or die(mysql_error());

// Retrieve all the data from the "database" table
$result = mysql_query("SELECT * FROM registration") or die(mysql_error());

echo "<table>";
while($row = mysql_fetch_array($result))
{

echo "<tr>";
echo "<td>" .$row['firstname']. "</td><td>". $row['lastname']. "</td>";
echo "<td>" .$row['address']. "</td><td>".   $row['city'].     "</td>";
echo "<td>"  .$row['state']. "</td>";
echo "<td>" .$row['zipcode']. "</td><td>".   $row['phone1'].   "</td>";
echo "<td>" .$row['phonenum']. "</td><td>".  $row['email'].    "</td>";
echo "<td>" .$row['day1']. "</td><td>".      $row['day2'].     "</td>";
echo "<td>" .$row['package'].  "</td>";


echo "</tr>";

}

echo "</table>";

misheck

Try this code below, I am at work so I do not have anywhere to test or debug and let me know how you get on.

<html>
<head>
<title> Alternating Rows </title>

<style media="screen" type="text/css">
.row0{ background:white; }
.row1{ background:black; }
</style>
</head>
<body>
<?php


// Make a MySQL Connection
mysql_connect("localhost", "*****", "****") or die(mysql_error());
mysql_select_db("***") or die(mysql_error());

// Retrieve all the data from the "database" table
$result = mysql_query("SELECT * FROM registration") or die(mysql_error());


echo "<table>";

$i = 0;
while($row = mysql_fetch_array($result))
{

$i = 1-$i;
$class = "row$i";

echo  '<tr class="$class">';
echo "<td>" .$row['firstname']. "</td><td>". $row['lastname']. "</td>";
echo "<td>" .$row['address']. "</td><td>". $row['city']. "</td>";
echo "<td>" .$row['state']. "</td>";
echo "<td>" .$row['zipcode']. "</td><td>". $row['phone1']. "</td>";
echo "<td>" .$row['phonenum']. "</td><td>". $row['email']. "</td>";
echo "<td>" .$row['day1']. "</td><td>". $row['day2']. "</td>";
echo "<td>" .$row['package']. "</td>";

echo "</tr>";

}

echo "</table>";

?>

</body>
</html>

misheck

Here is a tutorial on what you are trying to achieve. http://www.codewalkers.com/c/a/Database-Articles/Alternating-row-colors-with-PHP-and-mySQL/

jdotrose

Ok I used something similiar to that - Thanks all who replied for the help

$RowCounter=0;

echo "<table>";

while($row = mysql_fetch_array($result))
{

if($RowCounter % 2 == 0)
{
$RowColor='grey';
}
else
{
$RowColor='red';
}


echo '<tr style="background-color:'.$RowColor.';">';

echo "<td>" .$row['firstname']. "</td><td>". $row['lastname']. "</td>";
echo "<td>" .$row['address']. "</td><td>".   $row['city'].     "</td>";
echo "<td>" .$row['state']. "</td>";
echo "<td>" .$row['zipcode']. "</td><td>".   $row['phone1'].   "</td>";
echo "<td>" .$row['phonenum']. "</td><td>".  $row['email'].    "</td>";
echo "<td>" .$row['day1']. "</td><td>".      $row['day2'].     "</td>";
echo "<td>" .$row['package'].  "</td>";


echo "</tr>";

$RowCounter++;

}

echo "</table>";

bradgrafelman

Just my $.02... but it seems like adding two simple CSS lines:

tr:nth-child(odd)		{ background-color:#eee; }
tr:nth-child(even)		{ background-color:#fff; }

is a lot easier than muddling up not only the PHP code but also the HTML (which, to me, shouldn't be filled with a bunch of style-related crap that belongs in CSS).

But that's just my $.02 :p

Bonesnap

It should be noted that :nth-child() is not supported in Internet Explorer before version 9, so if cross-browser compatibility is important to you, I suggest using an alternative.

Another way to do it is using jQuery. I would either use jQuery or just simple math in my PHP loop to echo out a different class.