javascript - Bootstrap datetimepicker 未出现在正确的位置

Question

我有一个带有 Bootstrap 日期时间选择器的文本框来选择日期。问题是弹出窗口不在预期位置。

看到弹出窗口在左侧，而不是文本框所在的位置。这是代码片段..

<div class="form-group">
   <label class="col-sm-4 control-label">Release Date</label>
   @Html.TextBoxFor(m => m.Date, new { @id = "datepicker", @name = "date" })
   @Html.ValidationMessageFor(m => m.Date)
</div>

和 javascript..

$(function () {
    $("#datepicker").datetimepicker({
        format: "MM/DD/YYYY"
    });
});

有谁知道为什么会这样？为什么弹出窗口似乎认为文本框在另一个位置？

Answer 1

我通过在它周围添加一个带有自定义样式的 div 来解决这个问题。事实证明，问题是由于日期时间选择器捕捉到标签而不是文本框引起的。

<div class="form-group">
   <label class="col-sm-4 control-label">Release Date</label>
      <div class="col-sm-4" style="padding-left:0px">
          @Html.TextBoxFor(m => m.Date, new { @id = "datepicker" })
      </div>
   @Html.ValidationMessageFor(m => m.Date)
 </div>