CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
fc123
fc123

Reputation: 918

changing properties of bootstrap popover

I have a text field and button and I am showing popover (from bootstrap).

My code is following

   function a1() {
       $("#s1").popover("show");           
   }

popover is showing on text field after user click on button.

I need to change the placement, currently it's showing on right side. I want it on left side.

my html is following

  <button type="button" class="btn btn-primary" id="s2" onclick="a1()" >Popover</button>
<br />
<br />
<input type="text" id="s1" data-toggle="popover" title="Popover title" data-content="Please enter your name" />

I also want to change the color of popover.

I have tried this but it's not even showing popover

       $('#s1').popover({
          placement: 'right'
       }).show();



       $('#s1').attr('data-content', 'hello f');
       var popover = $('#s1').data('popover');
       popover.setContent();

Upvotes: 2

Views: 1292

Answers (1)

Buendiadas
Buendiadas

Reputation: 851

Bootstrap documentation says:

"Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-animation=".

You're missing the part of "data", this part of documentation is kind of confusing because you tend to look at the table without taking a look at the first paragraph.

So change your 

$('#s1').popover({
      placement: 'right'
   }).show();

with

$('#s1').popover({
      data-placement: 'right'
   }).show();

Upvotes: 3

Related Questions