Bootstrap-datepicker如何将日期放入输入字段

Question

我想知道，当日历嵌入时，如何使用bootstrap-datepicker将所选日期放入输入字段中。不知何故，我不能让它工作。

现在我有这样的想法：

<script>
$('#sandbox-container div').datepicker({
    weekStart: 1,
    startDate: "-",
    maxViewMode: 0,
    clearBtn: true,
    language: "nl",
    orientation: "top auto",
    daysOfWeekDisabled: "0,1,2,3,4",
    calendarWeeks: true,
    todayHighlight: true
});
</script>

在模板中，我有：

<div id="sandbox-container">
  <div id="datepicker"></div>
</div>

然而，当我尝试做一些事情时，比如：

<script>
$('#sandbox-container input').datepicker({
    weekStart: 1,
    startDate: "-",
    maxViewMode: 0,
    clearBtn: true,
    language: "nl",
    orientation: "top auto",
    daysOfWeekDisabled: "0,1,2,3,4",
    calendarWeeks: true,
    todayHighlight: true
});
</script>

和：

<div id="sandbox-container">
  <input type=text id="datepicker">
</div>

它只显示了一个输入字段。我做错了什么？

Answer 1

两件事：

1)想必你知道datepicker附带了JQueryUI。但是，如果您不知道这一点，那么您需要首先将其包含在JQuery中。例如：

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

2)其次，看起来你的选择器写得不正确。这应该是可行的：

<script>
  $(function() {
    $("#sandbox-container input").datepicker({
      weekStart: 1,
      startDate: "-",
      maxViewMode: 0,
      clearBtn: true,
      language: "nl",
      orientation: "top auto",
      daysOfWeekDisabled: "0,1,2,3,4",
      calendarWeeks: true,
      todayHighlight: true
    });
  });
</script>