CODEWITHSUNDEEP
jquerytwitter-bootstrap
Martin
Martin

Reputation: 1279

Bootstrap popover is not appearing

I'm facing strange issue. Bootstrap's popover is not appearing in my application.

Of course I am initiating popover in .js file (to be clear this file is also included into head section). $('[data-toggle="popover"]').popover();

This is how my simplest popover link looks like:

<a href="#" data-toggle="popover" title="Popover Header" data-content="Some content inside the popover">Toggle popover</a>

By the way bootstrap's tooltips are working correctly.

Update - head + body sections

<head>
    <title>@yield('title')</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="{{ URL::to('css\bootstrap.css')}}">
</head>
<body>
    <script src="{{URL::to('js\less.min.js')}}"></script>
    @include('includes.header')
    @yield('content')
    <script src="{{ URL::to('js\jquery-1.12.4.js')}}"></script>
    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'>
    <script src="{{ URL::to('js\app.js')}}"></script>
    <script src="{{ URL::to('js\bootstrap.min.js')}}"></script>
    rest of the code...
</body>

Upvotes: 1

Views: 81

Answers (1)

zerohero
zerohero

Reputation: 583

Move:

<script src="{{ URL::to('js\app.js')}}"></script>

Below:

 <script src="{{ URL::to('js\bootstrap.min.js')}}"></script>

And make sure all tags appear in the and not the

Because your script tags are in the body, the DOM needs to fully load first before it can execute. I'm surprised your console doesn't report an error.

Upvotes: 1

Related Questions