how to use image from table to image corousel?

Question

I make a search on php table. I'm able to search all image. My goal is put all the image on the image corousel but i failed, how to do it?

the original code of corousel image is:

<div class="gallery">
<div class="gallery-container">
  <img class="gallery-item gallery-item-1" src="image_view.php?id=12" data-index="1">
  <img class="gallery-item gallery-item-2" src="image_view.php?id=13" data-index="2">
  <img class="gallery-item gallery-item-3" src="image_view.php?id=14" data-index="3">
  <img class="gallery-item gallery-item-4" src="image_view.php?id=15" data-index="4">
</div>
<div class="gallery-controls"></div>

but the image from table is about 100 picture. What I have tried:

if(isset($_GET['cari'])){
$cari = $_GET['cari'];
$query = mysqli_query($link,"SELECT * from kamera where nama like '%".$cari."%'");
}else{
$query = mysqli_query($link,"SELECT * from kamera");}


$no = 1;
        while($row = mysqli_fetch_array($query))
        {
            ?>
            <tr>                


<div class="gallery">
<div class="gallery-container">
  <img class="gallery-item gallery-item-1" src="image_view.php?id=<?php echo $row['id']; ?>" data-index="1"> 
</div>
<div class="gallery-controls"></div>
</div></tr>
        

<?php
        }
        ?>

`
` is not allowed inside ``. You're creating a gallery for every row, probably not what you want. Move your `.gallery` and `.gallery-container` outside of the `while` loop — brombeer, Nov 09 '21 at 08:58
**Warning:** You are wide open to [SQL Injections](https://php.net/manual/en/security.database.sql-injection.php) and should use parameterized **prepared statements** instead of manually building your queries. They are provided by [PDO](https://php.net/manual/pdo.prepared-statements.php) or by [MySQLi](https://php.net/manual/mysqli.quickstart.prepared-statements.php). Never trust any kind of input! Even when your queries are executed only by trusted users, [you are still in risk of corrupting your data](http://bobby-tables.com/). [Escaping is not enough!](https://stackoverflow.com/q/5741187) — Dharman, Nov 09 '21 at 08:59
Should _all_ images really have a class of `gallery-item-1` and a `data-index="1"`? — brombeer, Nov 09 '21 at 08:59
@bombeer : yes, all image must have class of gallery and data index, but continious. image 2 must have gallery-item-2 and data-index="2" image 3 gallery-item-3 and data -index="3" — ianzzz, Nov 09 '21 at 09:11
What are you expecting your piece of code can do? the While-loop ain't doing anything. You need to echo only the tag not the whole
container — esQmo_, Nov 09 '21 at 13:26

score 1 · Accepted Answer · answered Nov 09 '21 at 21:28

You're doing it wrong. You only have to loop through the result from database and return or echo the relevant part as you have several images in the database. The way you're doing won't produce anything, you'll probably end up with a blank page.

Do something like below:

$count = 1; //Initialize this so you can add it to your img class in each iteration         
while($row = mysqli_fetch_assoc($result)) {
        $image_url = $row['image_url']; //Depends on your data
        $image_id = $row['image_id']; //Same here too
        //We"ll need to increment $count + 1 on each loop
        $count++;
    
        //Create the image, see here? we're echoing the result which will be 'printed'
        echo "<img src='$image_url' class='gallery-item gallery-item-$count' id='$image_id' alt='$image_id' >";
    }

Hope this helped.

how to use image from table to image corousel?

1 Answers1