How to apply different colors to different records?

Hi all

I have a snippet of code which works fine, my problem is, I’m trying to apply a different color to every other row.

example:

red
blue
red
blue
red

Code I have (focus on $bg):

$result1 = mysql_query($sql1) or die(mysql_error());
		$bg = 'odd';
		$DATA=array();
        while ($row1 = mysql_fetch_array($result1, MYSQL_ASSOC)) {
		$row1['name']=ucwords($row1['name']);
		$bg = ($bg=='odd' ? 'even' : 'odd');
		$DATA[]=$row1;
		}
        $num_rows=mysql_num_rows($result1);

I’m trying to add $bg to the UL class, so every other record is different:

<? if($num_rows): ?>
<? foreach($DATA as $row1): ?>	
		<ul class="reviews">
			<li><?=$row1['comment']?></li>
			<li><strong>by:</strong> <?=$row1['name']?>, <strong><?=$row1['subdir']?></strong></li>
		</ul>
<? endforeach ?>

I did try:

<ul class="reviews <? echo $bg ?>">

This added the odd .class to every UL, how do I get it to switch between odd & even?

Any suggestions? :slight_smile:



<?php $cycle = false; ?>
<? if($num_rows): ?>
<? foreach($DATA as $row1): ?>    
        <ul class="reviews<?php echo (($cycle =! $cycle)?' odd':''); ?>">
            <li><?=$row1['comment']?></li>
            <li><strong>by:</strong> <?=$row1['name']?>, <strong><?=$row1['subdir']?></strong></li>
        </ul>
<? endforeach ?>

You only need to differentiate either odd or even. Set the default color for all rows then override targeting the .odd class in this instance.

:wink: works great thanks, quite ironic your name oddz :slight_smile:

Ok I’ve set .review as the default and used .odd as every other like you said, everythings working.

Do I still need even in the code below? Should I delete some of this?

$bg = 'odd';
        $DATA=array();
        while ($row1 = mysql_fetch_array($result1, MYSQL_ASSOC)) {
        $row1['name']=ucwords($row1['name']);
        $bg = ($bg=='odd' ? 'even' : 'odd');
        $DATA[]=$row1;

Thanks oddz

And if you don’t mind, what exactly is <?php echo (($cycle =! $cycle)?’ odd’:‘’); ?> doing?

You are using an array to store all your data records, but only a single variable to store the odd/even. $bg will be overwritten every time a record is retrieved, and will always be set to whatever the last record was.

You need to move the $bg out of this loop, and into the loop you use for displaying the content:



<? if($num_rows): ?>
<? foreach($DATA as $row1): 
$bg = ($bg=='odd' ? 'even' : 'odd');
?>    
        <ul class="reviews <? echo $bg ?>">
            <li><?=$row1['comment']?></li>
            <li><strong>by:</strong> <?=$row1['name']?>, <strong><?=$row1['subdir']?></strong></li>
        </ul>
<? endforeach ?>


That should work.

:smiley: Thanks a lot gavco98uk, working just how i wanted, not sure I understand fully but it works. Welcome to sitepoint :slight_smile:

Yeah, you can now remove the alternating color variable from the data set because in reality it explicitly belongs within the template layer. The =! assigns the inverse value to $cycle each iteration. The inverse of true is false and false is true so what you get is an alternating two dimensional pattern. Coupled with the ternary operator every time $cycle resolves to false odd class is applied the ul and no class is applied when its true.

Oh… and the actually code is the below because the previous code assigns odd to even columns. Either way though your differentiating the rows.


<?php $cycle = false; ?>
<? if($num_rows): ?>
<? foreach($DATA as $row1): ?>    
        <ul class="reviews<?php echo (($cycle =! $cycle)?'':' odd'); ?>">
            <li><?=$row1['comment']?></li>
            <li><strong>by:</strong> <?=$row1['name']?>, <strong><?=$row1['subdir']?></strong></li>
        </ul>

Well explained, thanks oddz :cool:

update: So any technique will work, yours and gavco98uk… whats the best way? or just a matter of personal preference?

Just a matter of personal preference really, however you could argue computerbarrys is slightly better as it only uses a single CSS class, rather than two. Although in some cases it might be handy to have two seperate classes for the alternating rows.

There’s always more than one way to skin a cat, choose whichever works best for you.

There’s always more than one way to skin a cat
:slight_smile: Yes I’m starting to understand this now and thanks again guys for the help.