从内部 iframe 刷新父组件答案

【问题标题】：Refresh component in parent from inner iframe从内部 iframe 刷新父组件
【发布时间】：2016-06-22 04:27:54
【问题描述】：

我有这个 xhtml (primefaces) 简单页面：

....
<div id="header">
    <h:outputText value="#{userBean.name}"/>
</div>
<div id="content">
    <p:tabView value="#{appTabbedView.tabs}" var="tab" dynamic="true"
        cache="false">
        <p:tab title="#{tab.title}">
            <iframe frameborder="0" src="#{tab.page}" />
        </p:tab>
    </p:tabView>
</div>
.....

在 iframe 中，我加载了一个 p:tab，它加载了一个名为“Profile.xhtml”的页面，该页面允许编辑（更改）用户名。如何刷新标题以显示新用户的名称（我在 iframe 中！）？我找不到解决方案，我尝试了所有方法。

【问题讨论】：

未测试...用<h:panelGroup id="headerupd"... 和</h:panelGroup 包围您的标题div。在您的 bean 中，您可以添加 RequestContext.getCurrentInstance().update("headerupd");
好主意...但它似乎不起作用...至少在我的测试中

标签： jsf primefaces

【解决方案1】：

这是我的解决方案。有效！

....
<div id="header">
    <h:form id="formHeader">
        <p:commandLink id="hiddenLink" update="user" value="hiddenLink" style="display:none" />
        <h:outputText value="#{userBean.name}" id="user"/>
    </h:form>
</div>

<div id="content">
    <p:tabView value="#{appTabbedView.tabs}" var="tab" dynamic="true" cache="false">
        <p:tab title="#{tab.title}">
            <iframe frameborder="0" src="#{tab.page}" />
        </p:tab>
    </p:tabView>
</div>
.....

script.js：

function refreshHeader() {
    window.parent.document.getElementById('formHeader:hiddenLink').click();
}

在 Profile.xhtml 内：

....
<p:commandButton id="accept" ... oncomplete="refreshHeader()" />
....

【讨论】：

使用 p:remoteCommand 代替隐藏的 commandLink，并且需要知道 iframe 中组件的 id，在其中您“只是”声明一个 javascript 函数。