Page 1 of 1

Alternating Row Colors in a Table in HTML

Posted: Mon Jun 27, 2005 2:05 pm
by murph2481
Hello~

I would like to alternate row colors in a table that is generated from a mySQL result set. The table is generated from a while loop. Basically i would like the 2nd row to have a class type of 'highlightedrow' how do i write the code to do that? here is what i have so far:

Code: Select all

<?php
	$query = 'select *
		from class_groups
		where  =' .$_POST['scheduletype'].;
	
	$r = mysql_query($query);
	$row = mysql_fetch_array ($r)
	?>
	<table width="100%"  border="0" cellspacing="0">
      <tr>
        <td colspan="5" class="subTitle"><?php {print "{$row['Group_Name']}";} ?></td>
      </tr>
      <tr>
        <td class="headerRow"><div align="center">Class Name </div></td>
        <td class="headerRow"><div align="center">Day of Week </div></td>
        <td class="headerRow"><div align="center">Time</div></td>
        <td class="headerRow"><div align="center">Age Group </div></td>
        <td class="headerRow"><div align="center">Register Online </div></td>
      </tr>
	 <? 	while ($row = mysql_fetch_array ($r))
	{
	?>
      <tr <!--here is where i want to alternate colors by choosing a CSS Class type-->>
        <td><?php {print "{$row['Class_name']}";} ?></td>
        <td><?php {print "{$row['Day_of_week']}";} ?></td>
        <td><?php {print "{$row['Time']}";} ?></td>
        <td><?php {print "{$row['Age_group']}";} ?></td>
      </tr>
	  <?php } ?>

Thanks in advance
Dan
:lol:

Got It

Posted: Mon Jun 27, 2005 2:20 pm
by murph2481
I figured it out... Here is the answer in case you care....

Code: Select all

<?php
	$query = 'select *
			from `class_groups`
			where `Class_Group` =' .$_POST['scheduletype'].;
	
	$r = mysql_query($query);
	$row = mysql_fetch_array ($r);
	$color2 = "";
        $color1 = "lightRow";
	$row_count = 0;
	
	?>
	<table width="100%"  border="0" cellspacing="0">
      <tr>
        <td colspan="5" class="subTitle"><?php {print "{$row['Group_Name']}";} ?></td>
      </tr>
      <tr>
        <td class="headerRow"><div align="center">Class Name </div></td>
        <td class="headerRow"><div align="center">Day of Week </div></td>
        <td class="headerRow"><div align="center">Time</div></td>
        <td class="headerRow"><div align="center">Age Group </div></td>
        <td class="headerRow"><div align="center">Register Online </div></td>
      </tr>
	 <? 	while ($row = mysql_fetch_array ($r))
	{
	$row_color = ($row_count % 2) ? $color1 : $color2;
	?>
      <tr class="<? print $row_color ?>">
        <td><?php {print "{$row['Class_name']}";} ?></td>
        <td><?php {print "{$row['Day_of_week']}";} ?></td>
        <td><?php {print "{$row['Time']}";} ?></td>
        <td><?php {print "{$row['Age_group']}";} ?></td>
      </tr>
	  <?php 
	  $row_count++;
	  } ?>
Got to love google, and forgot about that whole MOD funtion...been a while since I have used that one

Posted: Mon Jun 27, 2005 2:34 pm
by pickle
It's actually a whole lot easier than that:

Code: Select all

while(loop_until_stop)
{
  $row_class = ($row_class == 'light_row') ? 'dark_row' : 'light_row';

  echo "<tr><td class = '$row_class'>Wow</td></tr>";
}
This is just a simple example, but you get the picture.

If you want more info, just search these forums for 'alternating row colors'

Posted: Mon Jun 27, 2005 2:42 pm
by djot
I always do it this way:

Code: Select all

If ($row_color == $color1) { $row_color = $color2; }
else  { $row_color = $color1; }

Posted: Mon Jun 27, 2005 2:52 pm
by pickle

Code: Select all

$row_class = ($row_class == 'light_row') ? 'dark_row' : 'light_row';
Is just a short way of doing:

Code: Select all

if($row_class == 'light_row')
{
  $row_class = 'dark_row';
}
else
{
  $row_class = 'light_row';
}
So we effectively do the same thing, mine's just shorter.

Posted: Mon Jun 27, 2005 3:00 pm
by djot
Yes, I know, you only were faster in submitting :)
Anyway, mine is more readable for beginners.

Posted: Mon Jun 27, 2005 3:24 pm
by pickle
Touché :wink: