Need ideas in proper html rendering with php

Question

I have constructed an SQL query to lay out some info on a web page. The query works well. The problem is with each iteration of while loop a CSS class needs to be auto-incremented by 1.

<div class="related-item item1">

'item1' should become 'item2' in the next iteration and so on. Can you give me something ideas how to do it?

  <?php
  //Construct the SQL query code
  $rel = "SELECT entries.*, images.name 
          FROM entries, images
          WHERE entries.id = blog_id
          ORDER BY dateposted DESC
          LIMIT 0, 3;";
  //Send the query to the MySQL server
  $result = mysql_query($rel); 

  //Pull the row as an associative array
  while ($row = mysql_fetch_assoc($result)) {

   echo '<div class="related-item item1">
          <div class="thumbnail-wrapper">';
   echo     '<a href="#"><img src="./images/' . $row['name'] . '" alt="How SHAPE Reader Caitlin Flora Lost 182 Pounds"/></a></div>
    <h4 class="related-article-title">
      <a href="#">' . $row['subject'] . '</a>
    </h4>
  </div>';
    } //End of while loop

  ?>

Please, [don't use `mysql_*` functions in new code](http://stackoverflow.com/questions/12859942/why-shouldnt-i-use-mysql-functions-in-php). *They are no longer maintained and are [officially deprecated](https://wiki.php.net/rfc/mysql_deprecation)*. See the [red box](http://uk.php.net/manual/en/function.mysql-connect.php)? Learn about [prepared statements](http://en.wikipedia.org/wiki/Prepared_statement) instead, and use [PDO](http://us1.php.net/pdo) or [MySQLi](http://us1.php.net/mysqli). [This article](http://php.net/manual/en/mysqlinfo.api.choosing.php) will help you decide which. — Jay Blanchard, Oct 01 '14 at 19:52

score 3 · Answer 1 · answered Oct 01 '14 at 19:50

Just keep a counter variable going

$cnt = 1;
while(fetch from db) {
   echo "<a class='foo{$cnt}'>click me</a>";
   $cnt++;
}

which produces

<a class='foo1'>click me</a>
<a class='foo2'>click me</a>
<a class='foo3'>click me</a>
etc...

but generally this sort of thing is NOT necessary for CSS. You'd have to create a css rule for EVERY one of those <a> elements being created, which gets incredibly ugly and repetitive. There is nth-child support in CSS, so you can write rules which "modify" themselves based on which child an element is (1st, 2nd, ... Nth).

score 0 · Answer 2 · answered Oct 01 '14 at 19:51

Add an integer and increment it...

  <?php
  //Construct the SQL query code
  $rel = "SELECT entries.*, images.name 
          FROM entries, images
          WHERE entries.id = blog_id
          ORDER BY dateposted DESC
          LIMIT 0, 3;";
  //Send the query to the MySQL server
  $result = mysql_query($rel); 

$i = 1;
  //Pull the row as an associative array
  while ($row = mysql_fetch_assoc($result)) {

   echo '<div class="related-item item{$i}">
          <div class="thumbnail-wrapper">';
   echo     '<a href="#"><img src="./images/' . $row['name'] . '" alt="How SHAPE Reader Caitlin Flora Lost 182 Pounds"/></a></div>
    <h4 class="related-article-title">
      <a href="#">' . $row['subject'] . '</a>
    </h4>
  </div>';
  $i++;
    } //End of while loop

  ?>

Need ideas in proper html rendering with php

2 Answers2