使用Primefaces进行部分页面渲染 - 使用<ui:include>时会过早更新?</ui:include>

时间:2012-08-23 09:30:30

标签: ajax jsf primefaces

我有一个使用Primefaces 3.3.1(在Glassfish 3.0.1上运行)的Web应用程序,用户可以在菜单中选择所需的内容。由于只刷新页面的一部分,我想使用AJAX部分页面刷新。存储URL的方法在commandButton的actionListener-attribute中提供,而必须更新的组件的id在commandButton的update-attribute中提供。

我首先附上我的示例源代码 - 我从另一个关于PPR的帖子中得到了这个源代码,但确认它正在工作:

main.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">

    <h:body>
        <h:panelGroup id="content" layout="block">
            <ui:include src="#{navBean.activePage}" />
        </h:panelGroup>

        <h:form>
            <p:commandButton value="next"
                             actionListener="#{navBean.next}" 
                             update=":content" />
            <p:commandButton value="back"
                             actionListener="#{navBean.back}" 
                             update=":content" />
        </h:form>
    </h:body>
</html>

NavBean

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.ActionEvent;

@ManagedBean
@SessionScoped
public class NavBean {

    private String activePage = "somepage.xhtml";


    public String getActivePage() {
        return activePage;
    }


    public void setActivePage(String activePage) {
        this.activePage = activePage;
    }


    public void next(ActionEvent e) {
        this.setActivePage("someotherpage.xhtml");
    }


    public void back(ActionEvent e) {
        this.setActivePage("somepage.xhtml");
    }
}

示例包含页面(“somepage.xhtml”)

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets">

    <h2>Just some content for testing purposes</h2>

</ui:composition>

现在问题是getActivePage 总是setActivePage之前调用 - 这显然是一个问题,因为必须点击两次按钮才能获得新内容内容。

我有一种感觉,我在这里遗漏了一些必要的东西,但在Google / stackoverflow上搜索并没有带来任何适用的结果。

更新:用actionListener替换action不起作用(我当然更改了被调用方法的输入参数)。

正如erencan在下面的评论中所建议的那样,我将<ui:include>替换为<h:outputText>以仅显示字符串:

<h:outputText value="#{navBean.activePage}" />

与我的期望相反,这是正常的。那么为什么<h:outputText>有效,而<ui:include>却没有?使用前者不是一个选项,因为我想使用JSFs模板功能。

1 个答案:

答案 0 :(得分:1)

我终于使用this回答了一个简单的问题来解决问题。我会在这里发布我的代码,以便遇到相同问题的任何人都可以使用它:

<强> main.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">

    <h:body>
        <h:panelGroup id="header" layout="block">
            <h1>Header</h1>
        </h:panelGroup>
        <h:panelGroup id="menu" layout="block">
            <h:form>
                <f:ajax render=":content">
                    <p:commandButton value="next" action="#{navBean.next}" process="@this"/>            
                    <p:commandButton value="back" action="#{navBean.back}" process="@this"/>
                </f:ajax>
            </h:form>
        </h:panelGroup>
        <h:panelGroup id="content" layout="block">
            <h:panelGroup rendered="#{navBean.activePage == 'firstAjax'}">
                <ui:include src="firstAjax.xhtml" />
            </h:panelGroup>
            <h:panelGroup rendered="#{navBean.activePage == 'lastAjax'}">
                <ui:include src="lastAjax.xhtml" />
            </h:panelGroup>
        </h:panelGroup>
    </h:body>
</html>

此代码基本上取自链接的答案,但我不得不稍微调整一下(基本上,将<h:commandLink>更改为<p:commandButton>,因为前者不知何故没有调用action中提供的方法{1}})。

<强> NavBean.java

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean
@RequestScoped
public class NavBean {

    private String activePage = "firstAjax";


    public String getActivePage() {
        return activePage;
    }


    public void setActivePage(String activePage) {
        this.activePage = activePage;
    }


    public void next() {
        this.setActivePage("lastAjax");
    }


    public void back() {
        this.setActivePage("firstAjax");
    }
}

只是一个持有变量的标准ManagedBean。

<强> firstAjax.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:form>
        <h2>content...</h2>
    </h:form>
</ui:composition>

包含的XHTML-Page。 lastAjax.xhtml几乎相同。