jQuery:如何将jQuery datepicker放入Bootstrap Popover中?

时间:2015-11-27 03:43:16

标签: javascript jquery css twitter-bootstrap datepicker

我试图在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>

0 个答案:

没有答案