html - 对话框组件中的primefaces日历问题

标签 html css jsf primefaces

您好,我一直在寻找解决此问题的方法已有一段时间了,但似乎找不到解决方法。希望你们中的一位能帮助我。

我在对话框组件中有一个primefaces(v6.2,omega 主题)日历组件(弹出窗口,不是内联)。打开对话框并单击日历输入字段时,会显示日历弹出窗口。我希望它做的是让它在输入字段旁边弹出(几乎是对话框之外的常规行为)。然而,我面临的问题是,当我向下滚动页面并单击输入组件时,弹出窗口将显示但与输入字段相关的特定偏移量。
以下屏幕截图说明了该问题。

first pic

second pic

这是我的代码:

<p:dialog id="dialog"
          widgetVar="dialog"
          modal="true">
    <p:panel id="panel">
        <p:outputPanel id="outputPanel">
            <p:panelGrid columns="2" layout="grid"
                         columnClasses="ui-grid-col-3, ui-grid-col-4"
                         styleClass="ui-noborder" width="100%">
                <p:outputLabel for="date" value="#{msg.date}"/>
                <p:calendar id="date" value="#{date}"
                            navigator="true" mask="true" pattern="dd/MM/yyyy"/>
            </p:panelGrid>
        </p:outputPanel>
    </p:panel>
....
</p:dialog>

我对 CSS 不太擅长,所以希望这是一个简单的解决方案,但遗憾的是我自己无法弄清楚。

最佳答案

截至 2021 年 3 月,此问题尚未解决
https://github.com/primefaces/primefaces/issues/3868
https://github.com/primefaces/primefaces/issues/5740
https://github.com/primefaces/primefaces/issues/6583
作为我的情况的解决方法,我把

<p:dialog blockScroll="true">
确保触发对话框的按钮具有
window.scrollTo(0,0);

关于html - 对话框组件中的primefaces日历问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54808627/

相关文章:

html - 在 Bootstrap 中居中一个 4 列的 Div

javascript - 新创建的按钮(通过 createElement ("Button"))激活自身。如何阻止它?

html - "width"在元视口(viewport)标签中做什么?

javascript - CSS slide 不滑动,只是出现

html - 如何在移动浏览器中更改/禁用输入文本颜色?

java - GlassFish + MySQL + XHTML + Java Beans + UTF-8 问题

html - CSS-如何给一个带有圆 Angular 的对象一个边框颜色?

php - 如何在音频标签HTML中播放大尺寸音频文件

git - *.NavData 文件来自哪里?

java - 异常 JSF 从数据库中删除