Datepicker 覆盖模式中的输入字段

Posted 2023-05-07

【中文标题】Datepicker 覆盖模式中的输入字段

【英文标题】：Datepicker covers the input field within a modal

【发布时间】：2018-06-05 07:29:05

【问题描述】：

日期选择器元素未在模式中正确创建，它覆盖了输入字段，我无法可视化数据

html:

<div id="datepicker" class="input-append date col-md-12" >
    <input  type="text" class="form-control">
    <span class="add-on">
        <span class="arrow"></span>
        <i class="fa fa-th"></i>
    </span>
</div>

js:

<script src="% static 'assets/plugins/bootstrapv3/js/bootstrap.min.js' %" type="text/javascript"></script> 


$("#datepicker").datepicker(
    format: "dd/mm/yyyy",
    startDate: "01-01-2015",
    endDate: "01-01-2020",
    todayBtn: "linked",
    autoclose: true,
    todayHighlight: true,
    container: '#myModal modal-body',
    zIndex: 2048,
);

【问题讨论】：

那么问题是什么？ #myModal HTML 是什么样的？

我该如何修复这个错误...

为 datepicker 添加相关库。

你的 HTML 是什么？被覆盖的输入的 css 是什么？仅使用您提供的代码，使用 jQueryUI 的 datepicker，没有任何东西覆盖任何东西。什么浏览器？究竟是什么错误？

在第三个输入中，日历覆盖了输入空间。

【参考方案1】：

这是为了后代，日期选择器必须在输入标签中初始化。

<input id="datepicker" type="text" class="form-control">

另一方面，我必须实现这个suggestion：