Discussion :

[mnssylvain]

Bonjour à tous,

J'ai écumé le web à la recherche d'une réponse sans succès.
J'utilise donc Bootstrap 4. Mon select semble fonctionné, il est rempli correctement..... par contre j'ai un problème d'affichage. Ma liste de choix s'affiche en double avec une apparence légèrement différente:



Je suppose que j'ai plus un problème de bootstrap qu'autre chose.......

Voici mon

Code html :

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
18
19
20
21
22
23
<div class="row">
            	 <!-- Menu déroulant des Miss -->
                <div class="col-md-6 offset-md-3" >
                	<form>
                    	<label for="listemiss-select"> Consulte une autre fiche: </label><br>
                        <select class="selectpicker" name="listemiss-select" size="1" id="listemiss-select">
 
                      <? $l=1;
                                           while ( $row = $listemiss->fetch()){
                                                  ?> <OPTION value="<? echo($l); ?>"> <? echo($row['Prenom'] ." " . $row['Nom']); ?> </OPTION> <?
                                                  $l++;
                                          }
                        
                                                ?>
 
                        </select>
                        <input type="submit" value="Valider">
                    </form>
 
 
                </div>
                </br>
             </div>

en bas de page je déclare les scripts... c'est peut être là que j'ai fait une bêtise ne maitrisant pas vraiment cette partie...

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
    <!-- Javascript files-->
    <script src="js/jquery.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
    <script src="js/jquery-3.0.0.min.js"></script>
    <script src="js/plugin.js"></script>
 
 
 
    <!-- sidebar -->
    <script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="js/custom.js"></script>
</body>

Peut être que la version de BootStrap utilisée ne prend pas bien en charge cet élément ? mais je n'ai rien trouvé concernant cette hypothèse, si c'était le cas il y aurait eu des éléments sur le net...
J'ai pas encore osé une mise à jour vers Bootstrap 5..... J'ai peur qu'il y ait trop de modifs à faire sur le site actuel.....
J'espère que vous aurez des pistes supplémentaires à explorer parce là je sèche !

Merci d'avance pour vos retours.

[NoSmoking]

Bonjour,

J'ai pas encore osé une mise à jour vers Bootstrap 5

et pourtant il faudrat le faire tôt ou tard.


En attendant regarde de plus près les fichiers JS inclus, il y a redondance il convient donc déjà de faire le tri pour partir sur quelque chose de sain.

[mnssylvain]

Merci pour ta réponse !
Je vais attendre encore un peu pour la mise à jour vers Bootstrap 5, histoire de me documenter un peu avant....

J'ai essayé de faire du ménage dans la déclaration des fichiers JS..... mais j'aurai besoin d'aide pour identifier les doublons.....
J'ai fait pas mal de copier coller de différents outils et à chaque fois j'ai rajouté une ligne de déclaration JS..... et surement qu'il y a d'autres doublons dans cette liste:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<!-- Javascript files-->
 
   <!-- Javascript files-->
          <script src="js/jquery.min.js"></script>
          <script src="js/popper.min.js"></script>
          <script src="js/bootstrap.bundle.min.js"></script>
    <!--<script src="js/jquery-3.0.0.min.js"></script>  -->
          <script src="js/plugin.js"></script>   
 
    <!-- sidebar -->
          <script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
          <script src="js/custom.js"></script>

J'ai mis en commentaire la ligne <!--<script src="js/jquery-3.0.0.min.js"></script> -->
car je pense que c'est la même chose que <script src="js/jquery.min.js"></script>
bien que je ne sache pas lequel est le plus récent....
Ca ne semble pas affecter le fonctionnement

[mnssylvain]

Bonjour,
Alors j'ai pris mon courage à deux main et j'ai fait du ménage dans la déclaration des scripts....
J'ai tout supprimé et remis peut à petit les déclarations des scripts JS......
En mettant le minimum demandé par Bootstrap ça fonctionne !

Encore un grand merci !