Incompatibilité Bootstrap avec Cakephp

Isselmoumg
CakePHP

Bonjour,

J'ai remarqué que quelques fonctionnalités de bootstrap ne fonctionnent pas avec mon cakephp (nottament dropdown et modal) j'ai testé le même code dans une autre page web n'est pas sous mon projet cakephp et ça fonctionne,
y'a il une explication?

8 réponses

connected
Réponse acceptée

Est-ce que tu as des erreurs dans la console javascript (F12 sous chrome, puis onglet Console) ?
Tu dois inclure jquery avant bootstrap, de plus tu n'as besoin que de bootstrap ou bien bootstrap.min

Lartak
Réponse acceptée

charger mon fichierstyle.css avant bootstarp.css?

S'il y a des propriétés dans ton fichier style.css que tu redéfinies sur celles de bootstrap, dans ce cas là il te faut laisser ton fichier style.css après le/les css de bootstrap, sinon ça n'a pas d'importance côté css.
S'il faut charger jQuery avant le javascript de Bootstrap, c'est parce qu'il utilise jQuery pour certaines de ses fonctionnalités, donc si tu ne respectes par l'ordre, les fonctionnalités en javascript de Bootstrap qui utilisent jQuery ne fonctionneront pas.

connected

Bonjour,

est-ce que tu inclus bien le fichier javascript de bootstrap dans ta page ?
On a besoin de plus de détails, c'est très vague...

Isselmoumg
Auteur

Oui j'ai bien inclu les fichiers js 

 <?php echo $this->Html->script('bootstrap') ; ?>
      <?php echo $this->Html->script('bootstrap.min') ; ?>
       <?php echo $this->Html->script('jquery') ; ?>
       <?php echo $this->Html->script('mesfonctions') ; ?>
        <?php echo $this->fetch("script"); ?>

et pour le code du dropdown 

 <li class="dropdown">
          <a class="dropdown-toggle" id="dropdown-toggle" data-toggle="dropdown" href="#">Page 1
          <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Page 1-1</a></li>
            <li><a href="#">Page 1-2</a></li>
            <li><a href="#">Page 1-3</a></li>
          </ul>
        </li>

et celui de javascript que j'ai ecrit au niveau de fichier mesfonctions.js

 $(document).ready(function(){
    $(".dropdown-toggle").dropdown();
});
Isselmoumg
Auteur

Merci à tous

Isselmoumg
Auteur

Mr Connected est ce que il vaut mieu également également de charger mon fichierstyle.css avant bootstarp.css?

connected

@Isselmoumg, non cela n'a acune incidence à moins que tu redéfinisse des styles de bootstrap. Si tu souhaites écraser des styles de bootstrap, tes styles doivent être chargé après la feuille de style de bootstrap. Si non peu importe l'ordre.

Isselmoumg
Auteur

Merci beaucoup pour ces precisions et cette illustration.