我试图在bootstrap popover中显示jquery datepicker,并在Datepicker inside bootstrap popover [closed]中尝试了解决方案,但它不起作用。
$(document).popover({
selector: '[data-toggle="popover"]',
html: true,
container: 'body'
}).on('shown.bs.popover', function() {
$('#date').datepicker({
dateFormat: "yy-mm-dd",
showOtherMonths: true,
selectOtherMonths: true
});
});
.popover {
max-width: 100%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" rel="stylesheet" />
<button class='btn btn-default' data-toggle='popover' title='header' data-content='<div class="row"><div class="col-sm-7"><div class="panel panel-default"><div class="panel-heading">Search by date <span class="glyphicon glyphicon-question-sign" style="cursor:help;float: right;" title="Search the allocation by the date the file is parsed. Only the parsed or allocated file will be shown by that date."></span></div><div class="panel-body"><div id="bootsdt"></div></div></div></div></div>'>Click me</button>