带有模态面板问题的Primefaces对话框

Question

当使用<p:dialog>标签（在Prime Faces 3.3.1中）并且模态属性设置为true时，我会遇到奇怪的行为。 “黑色半透明面板” - 位于弹出窗口和页面之间 - 正确覆盖页面大小从上到下，但当我向下滚动页面时，它会被剪切。

我认为Prime Faces（或jQuery）正在检索窗口的大小而不是页面的大小来计算暗半透明的面板尺寸。

有什么想法吗？

这是我的代码：

<p:dialog draggable="false" id="dialogAddItems" header="Add item" modal="true" resizable="false" widgetVar="widgetDialogAddItems" width="600" height="200">
    <h:form>
        ...
    </h:form>
</p:dialog>

Answer 1

我在primefaces 3.4中遇到了这个问题，设置appendToBody="true"的属性<p:dialog>解决了这个问题。我希望这也能解决你的问题。

Answer 2

所以，我尝试了appendToBody="true"并将标记放在页面上的许多不同位置。没有任何效果。甚至尝试将Prime Faces更新为最新版本。也没用。所以，我的解决方案是一种解决方法，但这是因为我没有其他想法：

.ui-widget-overlay {
   position: fixed !important;
   top: 0px !important;
}