Databases
StackOverflow2013
Postsdbo
POPartial page rendering with Primefaces - JSF 2.0 navigation
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPartial page rendering with Primefaces - JSF 2.0 navigation
    text
    copied!<p>I am trying to create a facelet page which updates <code>&lt;ui:insert&gt;</code> elements with ajax calls. Whenever a <code>&lt;p:commandButton action="next"/&gt;</code> is clicked ajax call should take place and only <code>&lt;ui:insert&gt;</code> parts of the facelet template should be updated. My question is exactly same as the question in <a href="https://stackoverflow.com/questions/5685354/partial-page-update-when-navigating-primefaces-ajax">here</a> but the solution over there does not work. Furthermore, considering the comment, it is quite ambiguous if the answer is accepted or not. I am stuck without any solution and not sure if this is related to <a href="http://www.primefaces.org/faq.html" rel="nofollow noreferrer">PrimeFaces FAQ#4</a> </p> <p>I have another solution proposal with <code>&lt;ui:import&gt;</code> but not quite sure if this is a good solution. I am storing active page in a bean attribute and updating the value with ajax calls. So any comments and/or ideas are more than appreciated. Here is my proposal: </p> <h3>template.xhtml</h3> <pre><code>&lt;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"&gt; &lt;h:head&gt; &lt;title&gt;&lt;ui:insert name="title" /&gt; &lt;/title&gt; &lt;/h:head&gt; &lt;h:body&gt; &lt;div id="wrapper"&gt; &lt;div id="header"&gt;Primafaces Partial Page Update navigation&lt;/div&gt; &lt;h:panelGroup id="content" layout="block"&gt; &lt;ui:insert name="content"&gt; Sample content. &lt;/ui:insert&gt; &lt;/h:panelGroup&gt; &lt;/div&gt; &lt;div id="footer"&gt;Made using JSF &amp;amp; Primefaces&lt;/div&gt; &lt;/h:body&gt; &lt;/html&gt; </code></pre> <h3>main.xhtml</h3> <pre><code>&lt;ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.prime.com.tr/ui" template="template.xhtml"&gt; &lt;ui:define name="title"&gt;Main page&lt;/ui:define&gt; &lt;ui:define name="content"&gt; &lt;ui:include src="#{navBean.activePage}" /&gt; &lt;/ui:define&gt; &lt;/ui:composition&gt; </code></pre> <h3>NavigationBean.java</h3> <pre><code>@Component("navBean") @Scope("session") public class NavigationBean implements Serializable{ private String activePage="firstAjax.xhtml"; public String getActivePage() { return activePage; } public void setActivePage(String activePage) { this.activePage = activePage; } public void next(ActionEvent e) { this.setActivePage("lastAjax.xhtml"); } public void back(ActionEvent e) { this.setActivePage("firstAjax.xhtml"); } } </code></pre> <h3>firstAjax.xhtml</h3> <pre><code>&lt;ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.prime.com.tr/ui"&gt; &lt;h2&gt;First Page!&lt;/h2&gt; &lt;h:form&gt; &lt;p&gt;Click the button to go to next page!&lt;/p&gt; &lt;p:commandButton value="Next" actionListener="#{navBean.next}" update=":content" /&gt; &lt;/h:form&gt; &lt;/ui:composition&gt; </code></pre> <h3>lastAjax.xhtml</h3> <pre><code>&lt;ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.prime.com.tr/ui"&gt; &lt;h2&gt;Last Page!&lt;/h2&gt; &lt;h:form&gt; &lt;p&gt;Click the Back button to go to previous page!&lt;/p&gt; &lt;p:commandButton value="Back" actionListener="#{navBean.back}" update=":content" /&gt; &lt;/h:form&gt; &lt;/ui:composition&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload