This question already has answers here:
Closed 6 years ago.
How to place a form within popover in bootstrap 3?
<a href="#" class="btn btn-lg btn-danger" data-toggle="popover" title="" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A Title">Click It !</a>
it gives a effect like :
I want to place a form within its body. How can we do it ?
$('#popover').popover({
html : true,
title: function() {
return $("#popover-head").html();
},
content: function() {
return $("#popover-content").html();
}
});
Popover HTML Markup:
<a href="#" id="popover">the popover link</a>
<div id="popover-head" class="hide">some title</div>
<div id="popover-content" class="hide">
<form>
<!-- my form -->
</form>
</div>
I add content on popover like this:
$('#your-poped').popover({
content: '<div id="preview"></div>',
html: true,
trigger: 'manual',
delay: {'show':1000, 'hide':250},
});
$('#preview').html(yourdata);