@Ashwini Agarwal-lösningen är partiell och för att visa både bildindikatorer och bilder går det inte att göra så eftersom det inte går att köra while-slingan två gånger så arbetslösningen blir att skapa arrayer före loop, ladda hämtad data till arrayer och sedan använd foreach
funktion för båda indicators
och för att visa images
hantera även den active
klass med counter
PHP-kod
<?php
$id=$_GET['id'];
$qry="select rel_movies from released_movies where rel_id='$id' ";
$qryr=$con->query($qry);
while($rr=$qryr->fetch_assoc()){
$film=$rr['rel_movies'];
$q="select * from gallery where category='$film'";
$qr=$con->query($q);
$rows = array(); //Declare rows as arrays before loop
while($r=$qr->fetch_assoc()){ //Run Loop
$rows[] = $r; //Load Data in arrays
} //close Loop
} //close First Loop, Side Note, You don't need This Loop
?>
Nu kommer karusellen inuti Modal Body att se ut så här (förklarad med kommentarer för att förstå hur detta fungerar)
<div class="modal-body">
<div id="lightbox" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<?php
$i = 1; //Counter
foreach ($rows as $r): //Foreach
$ol_class = ($i == 1) ? 'active' : ''; //Set class active for only indicator which belongs to respective Image
?>
//Here I add the counter to data-slide attribute and add class to indicator
<li data-target="#lightbox" data-slide-to="<?php echo $i;?>" class="<?php echo $ol_class; ?>"></li>
<?php $i++; ?>
<?php endforeach; ?> //Close Foreach
</ol>
<div class="carousel-inner">
<?php
$i = 1; //Counter
foreach ($rows as $r): //Foreach
$item_class = ($i == 1) ? 'item active' : 'item'; //Set class active for image which is showing
?>
<div class="<?php echo $item_class; ?>"> // Define Active Class Here
<img src="../AbaamAdmin/uploads/<?php echo $r['images'];?>" width="900px" height="500px" >
</div>
<?php $i++; ?>
<?php endforeach; ?> // Close Foreach
</div>
<a class="left carousel-control" href="#lightbox" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#lightbox" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
</div>