dúvida fullPage Layout primefaces

Front-end
#1

Olá pessoal,

Estou criando o layout do meu sist. utilizndo o componente <p:layout> do primefaces!

Minha tela inicial está em anexo:

Eu gostaria que a página correspondente ao item de menu fosse exibida na parte central sem que toda a página fosse renderizada.

2012/5/29/f5d020701d73d212a00f91bcb2c7f09f_9247.png_1920×1055 131 KB

#2

Esqueci de mencionar que estou usando tb o Facelets… mais não sei se é necessário, o que acham??

O código da tela inicial segue abaixo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

   <h:head>
   	<title>CE - Controle de Equipamentos</title>
   </h:head>
   <h:body>
   
   	<p:layout fullPage="true">
   		
   		<p:layoutUnit position="north" size="75" resizable="true">
   			<ui:insert name="header">
   			</ui:insert>
   		</p:layoutUnit>
   		
   		<p:layoutUnit position="west" width="225" header="Menu" collapsible="true" resizable="true">
		    		<h:form>
			   		<p:slideMenu style="width: 200px; height: 110px;">  
				         <p:submenu label="Equipamento" icon="ui-icon ui-icon-extlink">  
				             <p:menuitem value="Novo" icon="ui-icon ui-icon-disk" action="#{equipamentoMBean.novo()}" target="center"/>  
				             <p:menuitem value="Lista" icon="ui-icon ui-icon-arrowrefresh-1-w" action="#{equipamentoMBean.listar()}" />  
				         </p:submenu>  
				         <p:submenu label="Departamento" icon="ui-icon ui-icon-extlink">  
				             <p:menuitem value="Novo" icon="ui-icon ui-icon-disk" action="#{departamentoMBean.novo()}"/>  
					          <p:menuitem value="Lista" icon="ui-icon ui-icon-arrowrefresh-1-w" action="#{departamentoMBean.listar()}"/>   
				         </p:submenu>  
				         <p:submenu label="Funcionário" icon="ui-icon ui-icon-extlink">  
				             <p:menuitem value="Novo" icon="ui-icon ui-icon-disk" action="#{funcionarioMBean.novo()}"/>  
					          <p:menuitem value="Lista" icon="ui-icon ui-icon-arrowrefresh-1-w" action="#{funcionarioMBean.listar()}"/>   
				         </p:submenu>  
			     		</p:slideMenu>
		     		</h:form>
   		</p:layoutUnit>
   		
   		<p:layoutUnit position="center">
   			<ui:insert name="centro">
            </ui:insert>
   		</p:layoutUnit>
   		
   		<p:layoutUnit position="east" size="75" resizable="true" >
   			<ui:insert name="east">
   			</ui:insert>
   		</p:layoutUnit>
   		
   		<p:layoutUnit position="south" size="75" resizable="true">
   			<ui:insert name="south">
   			</ui:insert>
   		</p:layoutUnit>
   	</p:layout>
   	
  </h:body>

</html>

e o código da tela de cadastro (um dos itens do menu) tb segue abaixo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html 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.org/ui">

	<ui:decorate template="/testeLayout.xhtml">
		
		<ui:define name="header">
		</ui:define>
		
		<ui:define name="west">
		</ui:define>
		
		<ui:define name="centro">

			<h:form id="funcionario">

				<p:panel id="panel" header="Cadastro de Funcionários" toggleable="true" style="font-size:16px; font-family:Verdana">
				
					<p:messages id="msgs"/> 
				
					<h:panelGrid columns="3" style="font-size:12px; font-family:Verdana">
						<h:outputText value="Nome: *" />
						<p:inputText id="nome" value="#{funcionarioMBean.funcionario.nome}" required="true" requiredMessage="O campo nome é obrigatório">
							<f:validateLength minimum="2" maximum="60"/>
						</p:inputText>
						<p:message id="defaultMessage1" for="nome" display="icon"/>
			
						<h:outputText value="Ramal: " />
						<p:inputText id="ramal" value="#{funcionarioMBean.funcionario.ramal}">
							<f:validateLength minimum="4" maximum="4" />
						</p:inputText>
						<p:message id="defaultMessage2" for="ramal" display="icon"/>
						
						<h:outputText value="Departamento: *" />
						<h:selectOneMenu id="departamento" value="#{funcionarioMBean.funcionario.departamento.codigo}" required="true" requiredMessage="É necessário selecionar um departamento">
							<f:selectItem itemLabel="" itemValue="" />
							<f:selectItems value="#{selectOneMenuMBean.listaDepartamentos}"/>
						</h:selectOneMenu>
						<p:message id="defaultMessage3" for="departamento" display="icon"/>
					</h:panelGrid>

					<p:separator style="width:100%;height:2px" />

					<p:commandButton value="Salvar" action="#{funcionarioMBean.salvar()}" style="font-size:12px; font-family:Verdana; height:30px" update="panel"/>

					<a href="${pageContext.request.contextPath}/ce/index.jsf" style="right: 100%">Voltar ao menu inicial...</a>

				</p:panel>

			</h:form>

		</ui:define>

		<ui:define name="east">
		</ui:define>

		<ui:define name="south">
		</ui:define>

	</ui:decorate>
		
</html>
#3