0

I have this PHP MySQLi code to display name shopkeepers on my website this code is working for displaying data, but not working when I want to the next and previous slides.

    <?php
    $select_active_shopes="SELECT tbl_shopkeepers_info.*, tbl_active_shopkeepers.* FROM tbl_shopkeepers_info
    INNER JOIN tbl_active_shopkeepers ON(tbl_active_shopkeepers.shopkeeper_id=tbl_shopkeepers_info.shopkeeper_id)
    ORDER BY tbl_active_shopkeepers.active_shopkeeper_id DESC";
    $rs_active_shopes=mysqli_query($link,$select_active_shopes);
    ?>

    <div class="container-fluid text-center my-3">
   <h2 class="font-weight-light"></h2>
    <div class="row mx-auto my-auto">
     <div id="recipeCarousel" class="carousel slide w-100" data-ride="carousel">
        <div class="carousel-inner w-100" role="listbox">
        <?php
          $i = 1;
          $next_item = true;
          while($row_active_shopes=mysqli_fetch_array($rs_active_shopes))
          {
            $shop_img=$row_active_shopes['shop_img'];
            if ($i == 1) {
                echo '<div class="carousel-item active">';
            } elseif ($next_item == true) {
                echo '  <div class="carousel-item">';
            }
            ?>
        <div class="col-md-2">
          <div class="card-body">
              <div class="circular--portrait">
              <img class="img-fluid" src="<?php echo "images/".$row_active_shopes['shop_img'];?>">
              </div>
             <p class="card-text" id="font"><?php echo $row_active_shopes['location_name'];?></p>
          </div>
      </div>
       <?php
         $next_item = false;
         if ($i % 6 == 0){
           echo '</div>';
         $next_item = true;
         }
         $i++;
        }       
        ?>
        </div>
      </div>
       <a class="carousel-control-prev w-auto" href="#recipeCarousel" role="button" data-slide="prev">
          <span class="carousel-control-prev-icon bg-dark border border-dark rounded-circle" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
       </a>
      
       <a class="carousel-control-next w-auto" href="#recipeCarousel" role="button" data-slide="next">
         <span class="carousel-control-next-icon bg-dark border border-dark rounded-circle" aria-hidden="true"></span>
         <span class="sr-only">Next</span>
       </a>
    </div>

and with JS code:

$('#recipeCarousel').carousel({
  interval: 10000
})

$('.carousel .item').each(function(){
 var next = $(this).next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));

if (next.next().length>0) {
next.next().children(':first-child').clone().appendTo($(this));
}
else {
     $(this).siblings(':first').children(':first-child').clone().appendTo($(this));
}
});

This is my output: Show my output codes

my problem when I clicked the next and previous to the next slide not working the id name(recipeCarousel) appear at URL, How I can fix?

Talia
  • 1
  • 1
  • I don't see any element with class of `item` .. typo? – Vinay Jul 18 '20 at 11:44
  • @Viney, thanks for your answer, but how I can fix? – Talia Jul 18 '20 at 11:51
  • It is a very bad idea to use `die(mysqli_error($conn));` in your code, because it could potentially leak sensitive information. See this post for more explanation: [mysqli or die, does it have to die?](https://stackoverflow.com/a/15320411/1839439) – Dharman Jul 18 '20 at 12:00
  • @Dharman, I used this die only to see my errors, when I finished my work remove it. – Talia Jul 18 '20 at 12:04
  • Great, but you don't need to use it at all if you enable error reporting. Enabling error reporting is so much better than manual checking for error. Believe me – Dharman Jul 18 '20 at 12:06

0 Answers0