Dropdown does not work

Question

Dropdown does not work

Navigation

#1 by (1 votes)
#2 by (0 votes)

-1

I have a Dropdown menu that shows the links to the gallery and videos, however, if it is in a view other than the index.ctp the dropdown no longer works. But if I get the dropdown.js of the source code distribution and include it in the layout, the dropdowns do not work in index.ctp but the other pages already work. When I searched google I discovered a thread that caused dropdowns to work, However, they only opened once in the index.ctp view. What is the problem?

I'm using twitter bootstrap (the more compact version) and CakePHP 2.4.4

Layout

      <li class="dropdown">
            <a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">Serviços <b class="caret"></b></a>
            <ul class="dropdown-menu">
                <li><?php echo $this->Html->link('Música', array('controller'=>'services', 'action'=>'Musica'))?></li>
                <li><?php echo $this->Html->link('Animação Temática', array('controller'=>'services', 'action'=>'AnimacaoTematica'))?></li>
                <li><?php echo $this->Html->link('Promoção', array('controller'=>'services', 'action'=>'Promocao'))?></li>
                <li><?php echo $this->Html->link('Staff', array('controller'=>'services', 'action'=>'Staff'))?></li>
                <li><?php echo $this->Html->link('Aluguer', array('controller'=>'services', 'action'=>'Aluguer'))?></li>
            </ul>
        </li>

Layout Head

 <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title><?php echo $title_for_layout;//titulo dinamico da página?></title>
    <?php
    echo $this->Html->meta('icon');
    //echo $this->Html->css('cake.generic');
    echo $this->fetch('meta');
    echo $this->fetch('css');

    echo $this->Html->script('modernizr-2.6.2-respond-1.1.0.min');
    echo $this->fetch('script');
    echo $this->element('fancybox_links');
    echo $this->Html->script('jquery-1.11.0');
    echo $this->Html->script('main');
    echo $this->element('fancybox_links');
    echo $this->Html->css('http://fancyapps.com/fancybox/source/jquery.fancybox.css?v=2.1.5');
    echo $this->Html->script('http://fancyapps.com/fancybox/source/jquery.fancybox.pack.js?v=2.1.5');        
    echo $this->Html->css('bootstrap-theme.min');
    echo $this->Html->css('main');
    echo $this->Html->css('bootstrap.min');
    echo $this->Html->css('bootstrap');
    echo $this->Html->script('bootstrap');
    echo $this->Html->script('bootstrap.min');
    echo $this->Html->script('dropdown');
    ?>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <style>
        body {
            padding-top: 50px;
            padding-bottom: 20px;
        }
    </style>
    <script type="text/javascript">
        $(function(){
            $(".dropdown-toggle").click(function(){
                $(this).dropdown('toggle');
            });
        });    
    </script>
    <script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5">
            $(document).ready(function () {
                $(".fancybox3").fancybox(e){
                    openEffect : 'none',
                    closeEffect : 'none',
                    helpers : {
                        title : {
                            type : 'float'
                        }
                    }
                    e.preventDefault;
                });
            });
    </script> 
    <!--<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>-->
</head>

Errors of the poster.ctp view .

Errors of view index.ctp .

html cakephp twitter-bootstrap

asked by anonymous 31.03.2014 / 19:30

2 answers

1

As I am not allowed to comment, I am responding. From what I see of the errors the scripts you're using are not being loaded. He begins to try to solve the errors from top to bottom.

First why jQuery is not being loaded. Then I see some non-allowed accesses, you have to make sure your scripts are accessible.

Inspect the page for each cartaz.ctp and index.ctp and try the scripts link in the browser to see if anything , if it does not exist or is denied access.

02.04.2014 / 12:49

Change domain and site server CakePHP [closed] Problems with Dev-cpp [closed]

score 0 · Accepted Answer

After you've done a .js file cleanup in the webroot folder, and you've re-installed fancybox, this link, and then this plugin, the dropdowns started working correctly.

Layout Head

 <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title><?php echo $title_for_layout;//titulo dinamico da página?></title>
    <?php
    echo $this->Html->meta('icon');
    //echo $this->Html->css('cake.generic');
    echo $this->fetch('meta');
    echo $this->fetch('css');
    echo $this->Html->script('modernizr-2.6.2-respond-1.1.0.min');
    echo $this->fetch('script');
    echo $this->Html->script('jquery-1.11.0.min');
    echo $this->Html->script('main');
    echo $this->Html->css('main');

    echo $this->Html->css('bootstrap-theme.min');
    echo $this->Html->css('bootstrap.min');
    echo $this->Html->css('bootstrap');

    echo $this->Html->script('bootstrap.min');
    echo $this->Html->script('bootstrap');
    echo $this->Html->script('dropdown');
    echo $this->Html->script('collapse');
    ?>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <style>
        body {
            padding-top: 50px;
            padding-bottom: 20px;
        }
    </style>
    <script type="text/javascript">
        $(function(){
            $(".dropdown-toggle").click(function(){
                $(this).dropdown('toggle');
            });
        });    
    </script>
    <!--<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5">
            $(document).ready(function () {
                $(".fancybox3").fancybox(e){
                    openEffect : 'none',
                    closeEffect : 'none',
                    helpers : {
                        title : {
                            type : 'float'
                        }
                    }
                    e.preventDefault;
                });
            });
    </script> -->
    </head>