Bonjour,
J'ai quelques soucis avec le carousel Bootstrap4.

J'aimerais pouvoir avoir un carousel dynamique. J'ai une liste de filtre par année de 2003 à 2019 et quand je sélectionne l'un de ces filtres j'ai une liste d'éléments qui peuvent être visible ou invisible.
Déjà le problème ici c'est que lorsque l'on a des carousel-item en display none cela semble causer problème avec le carousel de Bootstrap4. Et j'aurais aimé ne pas avoir à supprimer ces éléments en display none.. Comment faire?

Autre problème j'utilise un widget qui me créé cette liste d'élément lors du chargement de la page. Si je veux mettre plusieurs carousels sur une même page je pensais alors créer mes différents carousels (qui auront tous les même Ids parce que j'utilise le même widget pour les créer) et ensuite en jquery je change l'attribut de chaque carousel et les prev et next href. Pour être sûre que le carousel se fait bien sur ces carousels avec nouvel Id j'ai tenté de rappeler la fonction carousel
Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(document).ready(function(){
 
var x = 1;
var newId = "carouselLetters";
$('.carousel').each(function(){
 
    $(this).attr('id',newId + x);
    $(this).find('.carousel-control-prev').attr('href','#' + newId + x);
    $(this).find('.carousel-control-next').attr('href','#' + newId + x);
 
    $(this).carousel();
    x++;
 
 
});
 
  });

Mais j'ai une erreur carousel not defined alors que j'appelle bien mes scripts dans le head et que mon 1er carousel fonctionne bien... une idée?

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

Merci!