pulling posts from database and wrapping every 3 posts in a container div

[zachwaggoner]

I need to create columns in my html with some comments that are being pulled from my database and posted via ajax.  This is what I need it to look like after the PHP does its thing.

 

<div class="container">

<div class="comment"></div>

<div class="comment"></div>

</div class="comment"></div>

</div>

 

right now it doesn't create the container causing me to have layout issues.

 

How would you have PHP wrap a container around every third div?

 

I'm very much a front end developer and can't seem to wrap my head around this one.

 

Thanks for the help!

[denno020]

Something like this will work:

$posts = array();//This will be your result set from the database
$count = 0;
$postCount = count($posts);
echo '<div class="container">'; //Open a container
foreach($posts as $post){
  echo '<div class="comment">'.$post.'</div>';
  $count++;
  $postCount--;
  if($count == 3){ //Check if 3 posts have been printed
    echo "</div>"; //close your container div
    if($postCount > 0){ //Check if there are more posts
      echo '<div class="container">'; //open a new container    
    }
    $count = 0; //reset 3-post counter
  }
}

Denno

[PaulRyan]

@Denno - If the posts array does not equal a number that is divisible by 3, then your code will not close the final div.

 

Try this instead.

 

<?PHP

  //### How many per row
  $perRow = 3;
 
  //### Keep count of posts per row
  $perRowCount = 0;
 
  //### Start output
  $output = '';
 
  //### Dummy data, replace with your own
  $posts = array('1', '2', '3', '4', '5', '6', '7', '8', '9', '10');
 
  //### Iterate over each post
  foreach($posts AS $post){
    //### If there is no remainer from division, open container
    if($perRowCount%$perRow == 0) {
      $output .= '<div class="container">Container Start'.PHP_EOL;
    }
    
    //### Add the comment element with data
    $output .= '<div class="comment">'. $post .'</div>'.PHP_EOL;

    //### IF the remainer from the division is 2, close the container ready for opening another next time round
    if($perRowCount%$perRow == 2) {
      $output .= 'Container End</div>'.PHP_EOL;
    }
    
    //### Increase per row count
    $perRowCount++;
  }
 
  //### If the remainder from the division is not 0, then close the final open div
  if($perRowCount%$perRow != 0) {
    $output .= 'Container End</div>'.PHP_EOL;
  }

  //### Echo the output
  echo $output;
 
?>

[denno020]

 

@Denno - If the posts array does not equal a number that is divisible by 3, then your code will not close the final div.

 

 

That's easily fixed by just adding an echo "</div>"; directly after the foreach, with another step of logic to make sure there aren't two ending divs