【发布时间】：2021-02-17 20:48:15
【问题描述】：
我为以下问题 p:calendar popup remain below from calendar input in dialog when scroll (on IE and Chrome) 重新创建了一个最小的可重现示例。我也遇到过这个问题，只是弄清楚发生了什么，但我不知道如何解决它。 selectOneMenu 的引用问题中的 appendTo 建议似乎不是我们可以应用于日历的属性。
复制方法如下：
-
如果父窗口滚动到顶部，则对话框上的日历弹出框位置正确
-
如果父窗口向下滚动一点，则对话框上的日历弹出窗口位于输入框下方一点
-
距离偏移量似乎与父窗口的滚动量有关。
-
top值似乎是罪魁祸首。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://xmlns.jcp.org/jsf/facelets" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui" xmlns:pe="http://primefaces.org/ui/extensions" xmlns:o="http://omnifaces.org/ui" xmlns:of="http://omnifaces.org/functions">
<h:head>
<title>Calendar</title>
</h:head>
<h:body>
<h1>Calendar Popup Issue PF 8.0</h1>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h:panelGrid id="gridId">
<h:panelGrid id="panelId">
<h:form id="laborForm">
<p:commandButton oncomplete="PF('dialogWv').show()" title="Click to open dialog" update="dialogId" value="Open dialog with popup time only calendar" />
</h:form>
</h:panelGrid>
</h:panelGrid>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p:dialog id="dialogId" header="Test" dynamic="true" widgetVar="dialogWv" modal="true" showEffect="fade" hideEffect="fade"
resizable="true" width="400px" height="100px">
<h:form id="formId">
<p:panelGrid style="margin-bottom: 5px; border: 2px; width: 100%;" id="pg1">
<p:row>
<p:column colspan="2">
<p:calendar value="#{cc.attrs.viewBean.backfitTime}" timeOnly="true" pattern="HH:mm" showMillisec="false" showSecond="false" required="true"
requiredMessage="Time is required" rendered="true" />
</p:column>
</p:row>
</p:panelGrid>
<br />
</h:form>
</p:dialog>
</h:body>
</html>
编辑 我目前无法升级到 PF10，因为我的网站太多的外观和感觉都被 10 打破了。所以我的短期修复只是使用 datePicker 但使用 PF8。但是带有 PF8 的 datePicker 渲染得并不好。加上鼠标指针在递增时会覆盖小时和分钟数字。
单击向上或向下箭头是低效的。
【问题讨论】：
-
这在 PF 10.0.0.RC1 或更高版本中已修复。我解决了这个问题。见：github.com/primefaces/primefaces/issues/6583
-
顺便说一句，请不要把你的问题变成一个新问题。如果您有新问题，请发布新问题。
标签： css jsf primefaces