title: primefaes submenu and layout
body: <p>I have a layout and I need to show a JSF page in the center position when a menu item is selected, and if I select other menu item it must change to this and so on. I dont know how to do this, all the pages must appear in the center position acording to the selection in the menu (left position)</p>
  
  <p><br>
      <br>
           
            
        </p>
  
  <pre><code>&lt;p:layoutUnit position="south" size="50"  resizable="true" closable="false" collapsible="false"&gt;  
      &lt;h:outputText value="South unit content." /&gt;  
  &lt;/p:layoutUnit&gt;  
  
  &lt;p:layoutUnit position="west" size="280" header="start" resizable="true" closable="false" collapsible="false"&gt;
          &lt;p:panelMenu style="width:100%"&gt; 
              &lt;p:submenu label="clinet maneger" id="panelMenu" &gt;  
  
                  &lt;p:menuitem value="basic"   
                  url="/pages/basicInfo.jsf" icon="ui-icon-document" /&gt; 
  
                  &lt;p:menuitem value="clinets information"  
                  url="/pages/clinets.jsf" icon="ui-icon-document"/&gt;
                  &lt;p:menuitem value="ernterprises Information"  
                  url="/pages/enterprises.jsf" icon="ui-icon-document"/&gt;
              &lt;/p:submenu&gt;  
              &lt;p:separator /&gt;  
          &lt;/p:panelMenu&gt;  
  &lt;/p:layoutUnit&gt;
  
  &lt;p:layoutUnit id="center" position="center" resizable="true"&gt;
          &lt;ui:insert name="center"&gt;&lt;/ui:insert&gt;
          &lt;ui:include src="/pages/clinetsList.xhtml"&gt;&lt;/ui:include&gt;
  &lt;/p:layoutUnit&gt;
  </code></pre>
  
  <p> </p>