Alternate row color in while loop

PHP
1

Hi, just wondering how I can edit this type of code to alternate the row colors using php?


echo '<div id="container">';

		while ($row = mysqli_fetch_assoc($wishlist)) {
				
			echo '<div id="item_name">';
				echo htmlspecialchars($row["item_name"], ENT_QUOTES, 'UTF-8');
			echo '</div>';
					
			echo '<div id="item_date">';
				echo $row["item_date"];
			echo '</div>';
					
			echo '<div id="item_section">';
				echo $row["item_section"];
			echo '</div>';
					
		echo '<br/>';
		}
echo '</div>';
2

Well putting it in rows to begin with would be a start. Wrap a row in a <div>


$count = 1;
while ..... { //I'm lazy atm
  $count = ($count + 1) % 2;
  echo "<div class='row".$count."'>";
  //rest of your code
  echo "</div>";
}

Then set up CSS rules for classes row0 and row1.

3

Set a counter outside the while loop then add a class depending if it’s an even row. Set up your CSS rules as needed.

<div id="container">
<?php
$i = 1;
while ($row = mysqli_fetch_assoc($wishlist)) {?>
	<div class="row<?php if($i % 2 == 0) echo ' alt'; ?>">
		<div id="item_name">
			<?php echo htmlspecialchars($row["item_name"], ENT_QUOTES, 'UTF-8'); ?>
		</div>
		
		<div id="item_date">
			<?php echo $row["item_date"]; ?>
		</div>
		
		<div id="item_section">
			<?php echo $row["item_section"]; ?>
		</div>
	</div>
	
	<br/>
<?php
	$i++;
}
?>
</div>

Edit: StarLion beat me to it :smiley:

4

hah. StarLion is quick like that :slight_smile: thank you both.

starlion, it works perfectly. I completely forgot that I want to set the background color of each row though, this is probably just a html/css issue now though, but I have:


echo '<div id="container">';

$count = 1;
        while ($row = mysqli_fetch_assoc($wishlist)) {

          $count = ($count + 1) % 2;
          echo "<div class='row".$count."'>";

            echo '<div id="item_name">';
              echo htmlspecialchars($row["item_name"], ENT_QUOTES, 'UTF-8');
            echo '</div>';

            echo '<div id="item_date">';
             echo $row["item_date"];
            echo '</div>';

            echo '<div id="item_section">';
             echo $row["item_section"];
            echo '</div>';

          echo '</div>'
        echo '<br/>';

        }

echo '</div>';

I can only manage to get #container to set the background color, but obviously that just sets the background color for the entire div.

Using background: or background-color: on .row0 and .row1 seems to do nothing.

If this is just a css/html problem let me know and I’ll try to figure it out, I feel like I ask for too much help around here. heh

5

Well if you’re getting the right row#'s out, it is a CSS issue. Without the CSS definitions I cant offer anything further.

6

I’m gonna take a shot in the dark and say the new .row <div>s need to be floated - but like StarLion mentioned we’d need to see the CSS rules applied to give a better answer.

7

Spot on beebs! Floating them allows background-color to be set.

All working perfectly, thank you guys. :slight_smile: :slight_smile: