Sunday, May 19, 2024
Homepage · jquery
 Popular · Latest · Hot · Upcoming
47
rated 0 times [  52] [ 5]  / answers: 1 / hits: 101671  / 10 Years ago, sat, october 25, 2014, 12:00:00

The bootstrap popover is not showing up my page



Here is my HTML:



<button type=button class=btn btn-lg btn-danger 

        data-toggle=popover title=Popover title

        data-content=And here's some amazing content. It's very engaging. Right?>

     Click to toggle popover

</button>


Here are all the js and css files I've added:



@Styles.Render(~/Content/css)

@Styles.Render(~/Content/bootstrap.min.css)

@Styles.Render(~/Content/bootstrap.css)

@Styles.Render(~/Content/bootstrap-theme.css)

@Styles.Render(~/Content/css/default.css)



@Scripts.Render(~/Scripts/jquery-2.1.1.js)

@Scripts.Render(~/Scripts/jquery.unobtrusive-ajax.js)

@Scripts.Render(~/bundles/modernizr)

@Scripts.Render(~/Scripts/bootstrap.js)


Can someone tell me where is the problem?



PS: Is there a way to get the popover to work without having to write any script code?


More From » jquery
 Answers
6

From the Docs on Popovers:




Opt-in functionality:

For performance reasons, the Tooltip and Popover data-apis are opt-in, meaning you must initialize them yourself.




So you must call .popover() manually in JavaScript like this:



$([data-toggle=popover]).popover();


Or you can use whatever selector you want



Here's an example using StackSnippets.





$([data-toggle=popover]).popover();

body {

  padding: 50px;

}

<link href=//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css rel=stylesheet/>



<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js></script>

<script src=//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js></script>





<button type=button class=btn btn-lg btn-danger 

        data-toggle=popover title=Popover title 

        data-content=And here's some amazing content. It's very engaging. Right?>

  Click to toggle popover

</button>





Note: This is similar to the answer to Bootstrap Tooltip Not Showing Up


[#69018] Wednesday, October 22, 2014, 10 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
harleyterryp
Add To Favorites
Follow
Total Points: 290
Total Questions: 92
Total Answers: 95
Location: Montenegro
Member since Sun, May 7, 2023
1 Year ago
harleyterryp questions
Fri, Jun 11, 21, 00:00, 3 Years ago
Fri, May 28, 21, 00:00, 3 Years ago
Mon, Nov 23, 20, 00:00, 4 Years ago
Fri, Oct 2, 20, 00:00, 4 Years ago
Sun, Jun 28, 20, 00:00, 4 Years ago
View All
;