导航时部分页面更新（PrimeFaces ajax）

小编典典

导航时部分页面更新（PrimeFaces ajax）

ajax

我已经使用facelets模板完成了一个基本的JSF应用程序。我的模板如下：

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

    <h:head>
        <!-- Links to CSS stylesheets... -->
        <title><ui:insert name="title" /> - FManager</title>
    </h:head>

    <h:body>
        <div id="wrapper">
            <div id="header"> <b>FManager</b> Application </div>

            <div id="content">
                <p:growl id="growl" />
                <ui:insert name="content">
                    Sample content.
                </ui:insert>
            </div>
        </div>

        <div id="footer">Made using JSF and Primefaces</div>
    </h:body>
</html>

然后，我有一个主页（如下所示），它导航到 第二页 。两个页面都使用上面的模板。

<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                template="./template.xhtml">

    <ui:define name="title">Main page</ui:define>

    <ui:define name="content">
        <h2>Welcome to the <b>FManager</b> application</h2>

        <h:form>
            <p>Click the button below to create the first entry!</p>
            <p:commandButton value="Create entry" action="create" />
        </h:form>
    </ui:define>

</ui:composition>

如果我<redirect/>在faces-config.xml中使用它，它将进行导航，但是将重新加载整个页面。我的问题是：

有没有一种方法可以从页面导航到另一个仅更新<ui:insert>模板部分的内容？（同时保留页面的其余部分不变）

谢谢！

阅读 306

2020-07-26

共1个答案

小编典典

您可以通过ajax重新加载内容，但URL将保持不变。如果负担得起，请按如下所示更新代码：

在中template.xhtml，替换

<div id="content">

通过

<h:panelGroup id="content" layout="block">

然后在中somepage.xhtml，替换

<p:commandButton value="Create entry" action="create" />

通过

<p:commandButton value="Create entry" action="create" update=":content" />

最终摆脱<redirect />（实际上，更希望摆脱所有导航案例，因为它们会使faces- config.xml文件the 肿）。重定向也可以在结果中指定，如中所示action="create?faces-redirect=true"。

这只会更新<title>。但是，您可以使用简单的JavaScript行来实现。

2020-07-26