UI Layout Initialization Error-The center-pane element does not exist - jsf

Question

I am using a Layout structure that has centerLayout, westLayout,northLayout
When i run the file, i take this following error:
"/UI Layout Initialization Error.
The center-pane element does not exist.
The-center pane is a required element."
my template is :
<p:layoutUnit position="north" size="100" collapsible="true">
<header>
<div class="logo1">
<img src="#{facesContext.externalContext.requestContextPath}/resources/images/logo1.png" alt="Gestion d'accès et de habilitations" />
</div>
<ul>
<li><h:link outcome="/profile" value="Profile"/></li>
<li>Se déconnecté</li>
</ul>
<div class="logo2">
<img src="#{facesContext.externalContext.requestContextPath}/resources/images/logo2.png" alt="Altijari Bank" />
</div>
</header>
</p:layoutUnit>
<p:layoutUnit position="west" size="210" header="Menus" collapsible="true">
<h:form id="frmMenu1">
<p:accordionPanel multiple="true" id="acc" activeIndex="0">
<p:tab title="Gestion des agences">
<p:menu style="width:100%" id="m1">
<p:menuitem value="Consulter" action="#{agenceController.prepareList()}"/>
<p:menuitem value="Ajouter" action="#{agenceController.prepareCreate()}" />
</p:menu>
</p:tab>
<p:tab title="Gestion des utilisateurs">
<p:menu style="width:100%" id="m2">
<p:menuitem value="Consulter" action="#{utilisateurController.prepareList()}"/>
<p:menuitem value="Ajouter" action="#{utilisateurController.prepareCreate()}" />
</p:menu>
</p:tab>
<p:tab title="Gestion des fonctions">
<p:menu style="width:100%" id="m3">
<p:menuitem value="Consulter" action="#{fonctionController.prepareList()}"/>
<p:menuitem value="Ajouter" action="#{fonctionController.prepareCreate()}" />
</p:menu>
</p:tab>
<p:tab title="Gestion des applications">
<p:menu style="width: 100%" id="m4">
<p:menuitem value="Consulter" action="#{applicationController.prepareList()}" />
<p:menuitem value="Ajouter" action="#{applicationController.prepareCreate()}"/>
</p:menu>
</p:tab>
<p:tab title="Gestion des fiches " >
<p:menu style="width: 100%" id="m5">
<p:menuitem value="Consulter" action="#{ficheController.prepareList()}"/>
<p:menuitem value="Ajouter" action="#{ficheController.prepareCreate()}" />
</p:menu>
</p:tab>
<p:tab title="Administration" >
<p:menu style="width: 100%" id="m6">
<p:menuitem value="Consulter" action="#{groupeController.prepareList()}" />
<p:menuitem value="Ajouter" action="#{groupeController.prepareCreate()}" />
</p:menu>
</p:tab>
<p:tab title="Traçabilité" >
<p:menu style="width: 100%" id="m7">
<p:menuitem value="Consulter" action="#{traceController.prepareList()}" />
<p:menuitem value="Ajouter" action="#{traceController.prepareCreate()}" />
</p:menu>
</p:tab>
</p:accordionPanel>
</h:form>
</p:layoutUnit>
I use primefaces 3.2, jsf 2.1, glassfish 3.1.2.1
Please help me.

Answer 1

As the error message suggests you are missing the center part of the layout.
It is a required element.
Define one similar to this:
<p:layoutUnit position="center">
YOUR CONTENT
</p:layoutUnit>

Answer 2

This happens when there is an error in the part of the page that is inside the center pane part. This can be an invalid xhtml tag, something wrong in a bean being called or whatever. Look in your server logging an see if there is anything there.

Answer 3

This seems to be a bug in Primefaces 6.2 and has been answered here: UI Layout Initialization Error PrimeFaces 6.2

Answer 4

On primefaces 5.1 I had the case when options ware set by controler bean
<pe:layout id="fullPage" options="#{layoutController.layoutOptions}" stateCookie="true">
and in that controler I was setting child layoutPanes that ware not defined
// options for nested center layout
LayoutOptions childCenterOptions = new LayoutOptions();
center.setChildOptions(childCenterOptions);
// options for center-north pane
LayoutOptions centerNorth = new LayoutOptions();
centerNorth.addOption("size", "50%");
childCenterOptions.setNorthOptions(centerNorth);
So if you are extending primefaces showcase, be sure to disable configuration on the unexsisting panes.
Since this error is not shown on other missing panes (east, west,..) this could be a big headache to solve.