Load Div HTML code inside PHP with Condition - php

Question

I am getting images from database and want display that images in slider using HTML and PHP code. I have HTML code for sample slider is like below
<div class="carousel-inner">
<div class="item active">
<img class="img-responsive" src="http://placehold.it/1200x600/555/000&text=One" alt="...">
<div class="carousel-caption">
One Image
</div>
</div>
<div class="item">
<img class="img-responsive" src="http://placehold.it/1200x600/fffccc/000&text=Two" alt="...">
<div class="carousel-caption">
Another Image
</div>
</div>
<div class="item">
<img class="img-responsive" src="http://placehold.it/1200x600/fcf00c/000&text=Three" alt="...">
<div class="carousel-caption">
Another Image
</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>
</div>
Its working fine but instead use Placeholder images, I want my images which I am getting from database like below PHP code
<?php
$i= 0;
if(!empty($images)){ foreach($images as $image){ $i++;
echo $image->title;
echo $image->file_name;
}
}
?>
I want for first image and then for all other images. I am new in PHP and so confused how I can do it, Let me know if any PHP expert can help me for do it.
Thanks!

Answer 1

It is pretty simple: you have to loop through the images and print the carousel div for each image inside the loop:
<?php
if (!empty($images)) {
?>
<div class="carousel-inner">
<?php
$active = 1;
foreach ($images as $image) {
?>
<div class="item <?php if ($active == 1) echo "active"; ?>">
<img class="img-responsive" src="<?php echo $image->title; ?>" alt="...">
<div class="carousel-caption">
<?php echo $image->file_name; ?>
</div>
</div>
<?php
$active++;
}
?>
</div>
<!-- Controls: Add them inside the condition: if(!empty($images) -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<?php
}
?>