p:commandButton 刷新整个页面而不是部分刷新,而 f:ajax 工作正常

p:commandButton refreshes entire page instead of partially whereas f:ajax works fine

我尝试在单击按钮时更新页面的一部分。 现在,我有以下内容:

template.xhtml

    <h:form prependId="false">

        <h:commandButton value="NEWS" action="news">
            <f:ajax render="newsContent"></f:ajax>
        </h:commandButton>

        <h:panelGroup layout="block" id="newsContent">
            <ui:insert name="newsContent">
                <ui:include src="/WEB-INF/partials/news/news.xhtml"/>
            </ui:insert>
        </h:panelGroup>

    </h:form>

/WEB-INF/partials/news/news.xhtml

<h:commandLink action="newsdetails">
    <f:ajax render="newsContent" />
</h:commandLlink>

newsdetails.xhtml

 <h:commandButton value="INDEX" action="index">
     <f:ajax render="newsContent" />
 </h:commandButton>

现在它工作正常,但是如果我用

之类的东西替换 <h:commandbutton>
<p:commandButton value="INDEX" action="index" update="newsContent"/>

然后内容更新了但是页面刷新了。有什么想法我在这里做错了吗?

您没有调用任何有效的 ajax 操作:

删除 action="index" 以避免重新加载索引页。

我终于解决了。

我在 Button 上使用了 actionListener。

<p:commandLink actionListener="#{news.setCurrent(n)}" update="newsContent" />

现在从 Bean 中读取包含的源:

<h:panelGroup layout="block" id="newsContent">
    <ui:insert name="newsContent">
        <ui:include src="#{news.page}"/>
    </ui:insert>
</h:panelGroup>

页面的 getter 类似于:

public String getPage() {
    if(current == null){
        return "/WEB-INF/partials/news/news.xhtml";
    }
    return "/WEB-INF/partials/news/details.xhtml";
}

在页面加载时,currentObject 仍然为空,因此显示 news.xhtml。单击后,当前设置为对象,页面更新为详细信息页面。无需重新加载页面。