BootstrapDatepicker出现在模态中的错误位置

我在页面上有一个按钮,调用具有datepicker的模态.

如果此按钮位于顶部(我不必滚动页面以单击),模式打开并且datepicker正确显示.

但是如果页面上的此按钮较低(因此我必须滚动页面才能单击),模式打开并且datepicker显示不正确.(不确定滚动是否有关系)

这是jsfiddle

这是图像显示问题,日期选择器应在上面显示为工具提示,但它会下降:

这是代码:

Contact


        

          

            

              ×Close
              
Modal title
            
            

              
                

                  Name
                  
                
                

                  Contact
                  
                
                

                  

                    

                      Date & Time
                      

                        
                        
                      
                    
                  
                   
                
              
            
          
          

            Close
            Contact 
          
        
      
    

编辑 datetimepicker工具提示移动了我滚动页面的数量,然后单击"联系人"按钮以显示包含datetimepicker的模式.

1> tjfo..：

---

我刚遇到同样的问题.我能够通过向div添加容器属性来解决它.

$('#myDatePicker').datepicker({
  container:'#myModalId'
});

或者如果你像我一样使用"延迟加载"方法:

参考:http://bootstrap-datepicker.readthedocs.org/en/latest/options.html

希望它可以帮助别人!

---

帮助我,长期寻找解决方案,谢谢

---

你的答案无效,因为问题是关于datetimepicker而不是datepicker

2> Shadi Namrou..：

---

如果输入的容器没有相对定位,则Datetimepicker将显示在错误的位置.

解决方案是:

---

这对我有帮助,tnx

3> Diogo Capela..：

---

使用Bootstrap 4.1.1时遇到了同样的问题.datepicker popover出现在input元素的顶部.

我使用这个CSS修复它:

/* fix bootstrap-datepicker positional bug */
.datepicker {
  transform: translate(0, 3.1em);
}