Datetimepicker日历未在正确位置打开

I am using Eonasdan bootstrap datetimepicker in paramquery grid. From starting I have faced one problem, If I open datetimepicker, the calendar is hiding inside the grid. When I given the css condition

我在paramquery网格中使用Eonasdan bootstrap datetimepicker。从开始我遇到了一个问题，如果我打开datetimepicker，日历隐藏在网格内。当我给出css条件时

.dropdown-menu {
position: fixed;
}

it is working. The calendar is visible clearly but it is not open in a correct place. After given "position:fixed", If I click picker icon the calendar is open in right-top of the grid or right-bottom of the grid. It is not open in an exact place. How can I resolve this?

这是工作。日历清晰可见，但未在正确的位置打开。给定“position：fixed”后，如果单击选择器图标，则日历将在网格的右上角或网格的右下角打开。它不是在确切的地方开放。我该如何解决这个问题？

3 个解决方案

#1

Try using widgetParent option from Datepicker $(".input-group.date").datetimepicker({ widgetParent: 'body'});

尝试使用Datepicker $（“。input-group.date”）中的widgetParent选项.datetimepicker（{widgetParent：'body'}）;

Now you can adjust positioning, widgetParent option allow you to display the widget in any container in the page.

现在您可以调整定位，widgetParent选项允许您在页面中的任何容器中显示小部件。

#2

Please remove your overflow:hidden

请删除你的溢出：隐藏

.pq-grid td.pq-grid-cell{overflow:hidden}

Replace this:-

替换这个： -

.pq-grid td.pq-grid-cell{overflow:visible}

Demo

演示

#3

I faced a similar problem where my date element in a table cell clipped the widget. I could not use my date element as the widget's DOM parent, but I still wanted to use it as a visual positioning.

我遇到了类似的问题，其中我的表单元格中的日期元素剪切了小部件。我无法将我的日期元素用作小部件的DOM父级，但我仍然希望将其用作视觉定位。

I've submitted a PR with code to handle this. I've added a new option: forceElementPosition. It allows DOM parenting by widgetParent, but positioning next to the input element.

我已经提交了一个带代码的PR来处理这个问题。我添加了一个新选项：forceElementPosition。它允许通过widgetParent进行DOM学习，但是在input元素旁边定位。

https://github.com/Eonasdan/bootstrap-datetimepicker/pull/1647

https://github.com/Eonasdan/bootstrap-datetimepicker/pull/1647