显示从数据库到引导轮播的多个图像

I have a lot of images in a DB and I want to display it in a bootstrap carousel using php.

我在DB中有很多图像,我想在使用php的bootstrap轮播中显示它。

[Problem] I am rookie with php so I hit the wall. Let me explain with code.

[问题]我是php的菜鸟,所以我碰到了墙。让我用代码解释一下。

<div class="carousel-inner">
  <div class="item active">
    <div class="row">
      <div class="col-md-3"><a href="#" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a></div>
      <div class="col-md-3"><a href="#" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a></div>
      <div class="col-md-3"><a href="#" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a></div>
      <div class="col-md-3"><a href="#" class="thumbnail"><img src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a></div>
    </div><!--.row-->
  </div><!--.item-->  

  <?php
  $pdo = connect();
  // display the list of all members in table view
  $sql = "SELECT * FROM filmovi";
  $query = $pdo->prepare($sql);
  $query->execute();
  $list = $query->fetchAll();
  ?> 

  <div class="item">
    <div class="row">
      <?php foreach($list as $rs) { ?>    
        <div class="col-md-3"><a href="#" class="thumbnail"><img src="assets/img/movies/<?php echo $rs['slika'] ?>" alt="Image" style="max-width:100%;"></a></div>
      <?php } ?>
    </div><!--.row-->
  </div><!--.item-->
</div>

As you can see, carousel shows 4 images at once and another 4 and so on. In a foreach loop as it is now I get all my images at once and item active is empty.

如您所见,旋转木马一次显示4张图像,另外4张图像,依此类推。在foreach循环中,我现在可以立即获取所有图像,并且项目活动为空。

I need to get 4 by 4 images from the DB to carousel but don't know which way to go.

我需要从DB到旋转木马获得4×4图像,但不知道要走哪条路。

1 个解决方案

#1

You need to specify a counter that will check after each 4 iterations, to create a new <div class="item">...</div> element.

您需要指定一个计数器,该计数器将在每4次迭代后检查,以创建新的

... 元素。

<?php 
$counter = 0; //Set the counter to zero
  foreach ($list as $single_list){
    if($counter % 4 == 0) { // On every fourth iteration create a new item and row DIV
      echo '<div class="item"><div class="row">';
    }

      ... your code to output the images ...

    if($counter % 4 == 0) {
      echo '</div></div>'; // Close the row and item DIV
    }
$counter++;
}

If you have problems implementing the code, or you don't understand what I've done here, don't hesitate to ask.

如果您在实施代码时遇到问题,或者您不明白我在这里做了什么,请不要犹豫。

#1