Bootstrap popover content cannot changed dynamically
Solution 1:
If you grab the popover instance like this:
var popover = $('.reply').data('bs.popover');
Then, to redraw the popover, use the .setContent()
method:
popover.setContent();
I found out browsing the source: https://github.com/twitter/bootstrap/blob/master/js/popover.js
So, in your example, try:
thisVal.attr('data-content',data).data('bs.popover').setContent();
Update
The setContent()
method also removes the placement class, so you should do:
var popover = thisVal.attr('data-content',data).data('bs.popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);
Demo: http://jsfiddle.net/44RvK
Solution 2:
Yes you can, in fact the easiest way haven't been suggested yet.
Here's my way ->
var popover = $('#example').data('bs.popover');
popover.options.content = "YOUR NEW TEXT";
popover is an object if you want to know more about it, try to do console.log(popover) after you define it to see how you can use it after !
EDIT
As of Bootstrap 4 alpha 5, the data structure is a bit different. You'll need to use popover.config.content
instead of popover.options.content
Thanks to @kfriend for the comment