Loading images to Bootstrap carousel from a MySQL database using PDO (fetchall problem)

I’m using PDO to insert images from a database to a Bootstrap carousel. By that I mean ( loading The image path ), but the problem is when I use fetchall(); or fetch I get all rows value like this:

require_once '..Config.php';

$dbCon = "mysql:host=$host;dbname=$db_name";
$conn = new PDO($dbCon, $username, $password);
$getquery = $conn->prepare('SELECT (imageurl) FROM special');
$getquery->execute();
$result = $getquery->fetchall();
echo $result['imageurl'];

The output is: Efexor.jpg path upload/17.jpg upload/17.jpg upload/19.jpg upload/18.jpg upload/18.jpg* that is all rows from imageurl column, so when I loop foreach ($result) to load images from database to a Bootstrap carousel. It dose’t work

<div id="demo" class="carousel slide" data-ride="carousel">

  <!-- Indicators -->
  <ul class="carousel-indicators">
  <?
    $i = 0;
    foreach($result as $row){
        $actives = '';
    if($i == 0){
        $actives ='active';
    }
    ?>
    <li data-target="#demo" data-slide-to="<?= $i; ?>" class="<?= $actives;?>"></li>
    <? $i++ ; }?>
  </ul>

  <!-- The slideshow -->
  <div class="carousel-inner">
  <?
    $i = 0;
    foreach($result as $row){
        $actives = '';
    if($i == 0){
        $actives ='active';
    }
    ?>
    <div class="carousel-item  <?= $actives;?>">
      <img src="<?= $row['imageurl']?>">
    </div>
    <? echo $row['imageurl'];?>
    <? $i++; }?>
  </div>

  <!-- Left and right controls -->
  <a class="carousel-control-prev" href="#demo" data-slide="prev">
    <span class="carousel-control-prev-icon"></span>
  </a>
  <a class="carousel-control-next" href="#demo" data-slide="next">
    <span class="carousel-control-next-icon"></span>
  </a>
</div>

Answer

Try like this:

<!-- The slideshow -->
  <div class="carousel-inner">
  <?
    $i = 0;
   $full_url = 'YOUR URL AND PATH TO IMAGE FOLDER HERE';
    foreach($result as $row){
        $actives = '';
    if($i == 0){
        $actives ='active';
    }
    ?>
    <div class="carousel-item  <?= $actives;?>">
      <img src="<?= $full_url . $row['imageurl']?>">
    </div>
    <? echo $full_url . $row['imageurl'];?>
    <? $i++; }?>
  </div>

Advertisement

Answer