[英]Datepicker not show on Bootstrap popover
I use a simple Bootstrap pophover, But i face problem when i insert Datepicker under this pophover, then Datepicker it's not show. 我使用一个简单的Bootstrap pophover,但是当我在这个pophover下插入Datepicker时我遇到问题,然后Datepicker它没有显示。 but, normal Datepicker is work if i don't insert it under pophover. 但是,如果我不在pophover下插入它,正常的Datepicker是有效的。
<div id="popover-content" class="hide">
<form class="form-inline" role="form">
<div class="clearfix ">
<div class="checkbox">
<label>
<input id="asap" type="checkbox"> ASAP
</label>
</div>
</div>
<div class="clearfix hideevent">
<div class="form-group">
<div class="checkbox">
<label>
<input name="morning" type="radio"> Morning
</label>
</div>
<div class="checkbox">
<label>
<input name="morning" type="radio"> Evening
</label>
</div>
</div>
<input class="form-control" id="date" name="date" placeholder="MM/DD/YYYY" type="text"/>
</div>
</form>
</div>
$("[data-toggle=popover]").popover({
html: true,
content: function() {
return $('#popover-content').html();
}
});
$('#date').each(function() {
$(this).datepicker('clearDates');
});
You can used your popover html content in data-content=''
attribute 您可以在data-content=''
属性中使用popover html内容
<input type="text" data-content=' popover html paste here ' readonly id="PopS" data-placement="bottom" data-toggle="popover" data-html="true" placeholder="Quando" class="form-control" data-container="body"/>
Then write bellow script: 然后写下以下脚本:
<script>
$("#PopS").popover({
html: true
}).on('shown.bs.popover', function () {
$('#date').datepicker({
format: 'dd/mm/yyyy',
});
});
</script>
Note: in this
<div id="popover-content" class="hide">
removeclass="hide"
注意:在此<div id="popover-content" class="hide">
removeclass="hide"
$('[data-toggle=popover]').on('show.bs.popover', function () {
$('#date').datepicker();
})
try this one. 试试这个。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.