页面加载时显示 Primefaces 的 OverlayPanel答案

【问题标题】：Display Primefaces's OverlayPanel when the page loads页面加载时显示 Primefaces 的 OverlayPanel
【发布时间】：2021-05-31 15:43:42
【问题描述】：

当点击目标组件（commandButton）时，页面会显示 Primefaces 的overlayPanel：

<p:commandButton id="inputBtn" value="Choose a data source" type="button" action="#{dataImportBean.oAuth}"/>
 
<p:overlayPanel
 id="overlaypanel1"
 for="inputBtn"
 dynamic="false"
 widgetVar="inputChooser"
 >
// contents of the overlay panel
</p:overlayPanel>

我需要在页面加载时显示overlayPanel，而不需要点击目标commandButton。

用例是：用户打开了overlayPanel，但 oAuth 流程使用户离开页面。 oAuth 完成后，用户将被重定向到该页面。但是，当页面加载时，overlayPanel 会关闭，而我需要将用户直接带回 overlayPanel，以保持一致性。

【问题讨论】：

标签： jsf primefaces

【解决方案1】：

在您的小部件 var 上使用客户端 API。您可以使用show() 来显示面板，因此在您的情况下：PF('inputChooser').show()。

要在页面加载时执行此操作，您可以将其放在 p:overlayPanel 之后：

<c:if test="#{yourCondition}">
<script>$(function() { PF('inputChooser').show() })</script>
</c:if>

另见：

https://primefaces.github.io/primefaces/10_0_0/#/components/overlaypanel?id=client-side-api

【讨论】：