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

Question

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

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"/>

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

Answer 1

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

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

Answer 2

我终于解决了。

我在 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。单击后，当前设置为对象，页面更新为详细信息页面。无需重新加载页面。

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

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

jsf

ajax-upload

primefaces

jsf-2

commandbutton