如何使用bootstrap框架将表单放在popover中?

时间:2012-12-16 13:51:26

标签: twitter-bootstrap

我想要做的是在popover中放一个简单的表单,现在我的popover工作正常,但是当我把表单放在popover中时它不起作用。

这是我的输出

enter image description here

这是我的代码

<a href="#" class="btn" rel="popover" data-placement="bottom" data-content="
<form class='form-horizontal'>
<div class='control-group'>
<label class='control-label' for='inputEmail'>Start Date</label>
<div class='controls'>

<input type='text' class='span3 ' name='start_date' id='start_date' placeholder='News Date' value='<?php echo date('d-m-Y'); ?>' >
</div>
</div>
<div class='control-group'>
<label class='control-label' for='inputEmail'>End Date</label>
<div class='controls'>
<input type='text' id='end_date' name='end_date' placeholder='End Date' class='input-xlarge uneditable-input'>
</div>
</div>
</form>" title="Popover on bottom">         
</a>

这是教我的网址做了这样的事情 Contain form within a bootstrap popover?

我的bootstrap版本是2.2.2,任何想法如何解决我的问题?感谢

2 个答案:

答案 0 :(得分:8)

您可以在包含popover

data-html="true"标记上设置<a>

答案 1 :(得分:0)

看看这个jsfiddle,我使用了3个简单的按钮:here

我将我的html代码复制到jquery变量中:

var mycontent='<div class="btn-group"> <button class="btn">Left</button> <button class="btn">Middle</button> <button class="btn">Right</button> </div>'  

即使您删除html: true,

,它也能正常工作