フォームをデータタグではなくマークアップに配置します。これはどのように機能するかです:
JSコード:
$('#popover').popover({
html : true,
title: function() {
return $("#popover-head").html();
},
content: function() {
return $("#popover-content").html();
}
});
HTMLマークアップ:
<a href="#" id="popover">the popover link</a>
<div id="popover-head" class="hide">
some title
</div>
<div id="popover-content" class="hide">
<!-- MyForm -->
</div>
デモ
代替アプローチ:
X-編集可能
あなたはを見てみたいことがありますX-編集可能。ポップオーバーに基づいてページ上に編集可能な要素を作成できるライブラリ。
Webコンポーネント
Mike CostelloはBootstrap Web Componentsをリリースした。この気の利いたライブラリには、フォームをマークアップとして埋め込むことができるPopoversコンポーネントがあります。
<button id="popover-target" data-original-title="MyTitle" title="">Popover</button>
<bs-popover title="Popover with Title" for="popover-target">
<!-- MyForm -->
</bs-popover>
デモ