隐藏在 JQuery 对话框中的引导程序 DateTimePicker

Question

我在 JQuery 对话框中有一个引导 datetimepicker (as here)。但是，当显示日期时间选择器时，当我希望它显示在对话框顶部时，它会隐藏在对话框内。

这是它目前的样子：

如您所见，这远非理想。

我已经研究过，我似乎找到的唯一解决方案是将 z-index 增加到一个很大的值，但这似乎不起作用。我已经尝试了许多不同的类，例如 .datepicker .ui-datepicker .bootstrap-datetimepicker-widget 并且还尝试了使用和不使用 !important 但似乎没有任何效果。

还有人有其他想法吗？

我的代码如下：

<div class="mui-textfield">
    <input type="date" id="txtDate"/>
    <label>Date</label>
</div>

$('#txtDate').datetimepicker({
    format: 'DD-MM-YYYY',
    keepOpen: false
});

Answer 1

z-index 对我来说确实是个问题，但我还必须在对话框和对话框内容 div 上设置 overflow: visible 才能将其转义。这是最终对我有用的css：

.datepicker
{
    z-index: 99999   !important;
}
.ui-dialog {
    overflow:visible !important;
}
.ui-dialog-content {
    overflow:visible !important;
}