I have this table:
img id | img_path | listing_assoc_id| ---------------------------------------- 11 |img/img1.jpg | 12 | 12 |img/img2.jpg | 12 | 13 |img/img3.jpg | 12 | 14 |img/img4.jpg | 12 | 15 |img/img5.jpg | 12 | 16 |img/img6.jpg | 12 | 18 |img/img7.jpg | 12 | 21 |img/img8.jpg | 12 | 22 |img/img9.jpg | 12 | 23 |img/img10.jpg| 12 | 24 |img/img11.jpg| 12 |
And I want to display it into a table in html like this maximum of 5 images per row. I have been fiddling with different loops in combination of different loops like above for a couple hours but haven't found one that works like I need. They are either displaying the same images across the entire row or are messed up in some other way. Obviously need to use tr & td elements to format table correctly.
What I need:
<tr> <td>img1</td> <td>img2</td> <td>img3</td> <td>img4</td> <td>img5</td> </tr> <tr> <td>img6</td> <td>img7</td> <td>img8</td> <td>img9</td> <td>img10</td> </tr> <tr> <td>img11</td> </tr>Some of the code that doesn't work:
$query = "SELECT * FROM listings_gallery WHERE listing_assoc_id = " 12 " ORDER BY img_id ASC"; $image_set = mysqli_query($connection, $query); echo '<tr>'; while($img = mysqli_fetch_assoc($image_set)){ while($img['img_id'] < 5){ echo "<td><img src='" . $img['img_path'] . "'></td>"; } echo '<tr>'; }
I wouldn't actually depend on the image ID. You could use % 5
to do this, but the IDs may be out of order, etc. Instead, you can just fetch everything into an array and use array_chunk
$img = array();
while ($img = mysqli_fetch_assoc($image_set)) {
$imgs[] = $img;
}
foreach (array_chunk($imgs, 5) as $img_chunk) {
echo "<tr>";
foreach ($img_chunk as $img) {
echo "<td>$img</td>";
}
echo "</tr>";
}
This is probably about as simple as it gets but it's not as memory efficient as could be. You could also maintain your own counter and check % 5
for that to break out of the inner loop.
$images_rows = mysqli_query($connection, $query);
$images = array();
while ($image = mysqli_fetch_assoc($images_rows)) {
$images[] = $image;
}
echo '<table><tr>';
$ct = 0;
$ctt = 0;
$size = sizeOf($images) - 1;
foreach($images as $image){
if($ct == 5) {
echo '<tr>';
$ct = 0;
}
echo "<td><img src='" . $image['img_path'] . "'></td>";
$ct++;
$ctt++;
echo ($ct == 5 && $ctt != $size) ? '</tr>': '';
}
echo '</tr></table>'