title: how to do partial page rendering (center content) with jsf2 templating via ajax (from menu)
body: <p>i have been struggling getting this to work for 2 weeks, I am trying to merge info from BalusC from these 2 posts to (<a href="https://stackoverflow.com/questions/7108668/how-to-ajax-refresh-the-main-content-part-by-navigation-menu">link1</a>  <a href="https://stackoverflow.com/questions/4792862/how-to-include-another-xhtml-in-xhtml-using-jsf-2-0-facelets">link2</a>) to achieve partial page rendering of a center content area via a menu on the left. So the links on the left would update the center content via partial page rendering using <code>&lt;f:ajax&gt;</code> or maybe <code>&lt;a4j:ajax&gt;</code> via richfaces</p>
  
  <pre>
  ------------------------------------------------------
  | include1 link |                                     |
  | include2 link |  center content like include1.xhtml |
  | include3 link |                                     |
  ------------------------------------------------------
  </pre>
  
  <p>my page-layout.xhtml (master template to be used by include1.xhtml, include2.xhtml,..)looks like this.</p>
  
  <pre><code>&lt;h:body&gt;
      &lt;div id="top" class="top"&gt;
          &lt;ui:insert name="top"&gt;page-layout default top content&lt;/ui:insert&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;div id="left"&gt;
              &lt;h:form id="navigationFormId"&gt;             
                      &lt;f:ajax render=":contentForm"&gt;                                        
                          &lt;h:commandLink value="include1" 
                                         action="#{navigationBean.setPage('include1')}" /&gt;
                          &lt;p&gt;&lt;/p&gt;
                          &lt;h:commandLink value="include2" 
                                         action="#{navigationBean.setPage('include2')}" /&gt;                    
                          &lt;p&gt;&lt;/p&gt;
                          &lt;h:commandLink value="include3" 
                                         action="#{navigationBean.setPage('include3')}" /&gt;   
                          &lt;p&gt;&lt;/p&gt;
                      &lt;/f:ajax&gt;                                     
              &lt;/h:form&gt;
          &lt;/div&gt;
          &lt;div id="content"&gt;
             &lt;ui:insert name="content"&gt;
  
                  &lt;h:panelGroup id="contentPanelGroup" layout="block"&gt; 
                      &lt;h:form id="contentForm"&gt;
  
                          &lt;h:panelGroup rendered="#{navigationBean.page == 'include1'}"&gt;            
                              &lt;ui:include src="include1.xhtml" /&gt;         
                          &lt;/h:panelGroup&gt; 
                          &lt;h:panelGroup rendered="#{navigationBean.page == 'include2'}"&gt;            
                              &lt;ui:include src="include2.xhtml" /&gt;         
                          &lt;/h:panelGroup&gt;
                          &lt;h:panelGroup rendered="#{navigationBean.page == 'include3'}"&gt;             
                              &lt;ui:include src="include3.xhtml" /&gt;         
                          &lt;/h:panelGroup&gt;
  
                      &lt;/h:form&gt; 
                 &lt;/h:panelGroup&gt;     
  
              &lt;/ui:insert&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/h:body&gt;
  </code></pre>
  
  <p>NavigationBean.java is defined as a ViewScoped bean via CDI with @Named</p>
  
  <p>public class NavigationBean implements Serializable {</p>
  
  <pre><code>public NavigationBean() {}
  
  public String getPage() {return page;}
  public void setPage(String p) {page = p;}
  private String page = "include1";
  </code></pre>
  
  <p>}</p>
  
  <p>the included pages are file like include1.xhtml and include2.xhtml and should be loaded into center content when the left menu links are clicked, here is a sample include2.xhtml</p>
  
  <pre><code>&lt;h:body&gt;
  
      &lt;ui:composition template="page-template.xhtml"&gt;
          &lt;ui:define name="content"&gt;
  
               include2
  
               &lt;h:form&gt; 
                   form components for include2
               &lt;/h:form&gt;
  
          &lt;/ui:define&gt;
      &lt;/ui:composition&gt;
  
  &lt;/h:body&gt;
  </code></pre>
  
  <p></p>
  
  <p>I am getting FileNotFoundException, although the stack trace does not
  tell which one, but removing the </p>
  
  <pre><code>&lt;h:panelGroup rendered=".....&gt;
      &lt;ui:include src="..." /&gt;
  &lt;/h:panelGroup&gt;
  </code></pre>
  
  <p>tags removes the exception. I think this is the proper implementation to accomplish this based on 2 of BalusC posts, but just can't get it to work.</p>