The following code works fine with PrimeFaces 6.0 and 6.1, but with 6.2 when I click on button Validate I see the dialog with the message:
/ UI Layout Initialization Error
The center-pane element does not exist.
The center-pane is a required element.
I Use: JSF 2.2, PrimeFaces 6.2, Tomcat 8.5.23
Is there something wrong with the code or the problem is in PrimeFaces 6.2 ?
Company.java
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import com.company.helper.MessagesHelper;
@ManagedBean(name = "company")
@ViewScoped
public class Company implements Serializable {
private static final long serialVersionUID = -8386148997526982963L;
private String regNumber;
public void validateRegNumber() {
if(regNumber == null || regNumber.equals("")) {
MessagesHelper.addMessageError("Invalid Registration Number!");
} else {
MessagesHelper.addMessage("Registration Number is Valid!");
}
}
public String getRegNumber() {
return regNumber;
}
public void setRegNumber(String regNumber) {
this.regNumber = regNumber;
}
}
MessagesHelper.java
import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;
public class MessagesHelper {
public static void addMessage(String summary) {
addMessage(summary, null);
}
public static void addMessageError(String summary) {
addMessageError(summary, null);
}
public static void addMessage(String summary, String detail) {
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, summary, detail);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public static void addMessageError(String summary, String detail) {
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_ERROR, summary, detail);
FacesContext.getCurrentInstance().addMessage(null, message);
}
}
validation.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
template="../templates/template.xhtml">
<ui:define name="content">
<h:form id="frmValidate">
<p:growl id="msgs" showDetail="true" />
<div class="ui-fluid">
<div class="ui-grid ui-grid-responsive">
<div class="ui-grid-row">
<p:outputLabel for="regNumber" value="Registration Number: "></p:outputLabel>
<p:inputText id="regNumber" styleClass="inputClass" value="#{company.regNumber}" />
<p:commandButton value="Validate" id="btnValidate" ajax="false" action="#{company.validateRegNumber()}" />
</div>
</div>
</div>
</h:form>
</ui:define>
</ui:composition>
footer.xhtml
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<center>
<h:outputText style="font-size:13" value="Company Name 2018" />
</center>
</ui:composition>
header.xhtml
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<center>
<h:form id="formWelcome">
<p:toolbar id="toolbarWelcome">
<p:toolbarGroup align="left" styleClass="my-toolbar-group-left">
<h:outputText value="Project Name" />
</p:toolbarGroup>
<p:toolbarGroup align="right">
<p:outputLabel for="uname" value="Username:" />
<p:outputLabel id="uname" value=" myUserName" />
</p:toolbarGroup>
</p:toolbar>
</h:form>
</center>
</ui:composition>
menu.xhtml
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:form>
<p:panelMenu style="width:212px">
<p:submenu label="Main Menu">
<p:menuitem value="Submenu 1"/>
<p:menuitem value="Submenu 2"/>
</p:submenu>
</p:panelMenu>
</h:form>
</ui:composition>
template.xhtml
<!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:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core" >
<f:view contentType="text/html" encoding="UTF-8">
<h:head>
<f:facet name="first">
<link rel="shortcut icon" type="image/x-icon" href="#{resource['images/favicon.ico']}" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<title>Project Name</title>
</f:facet>
<f:facet name="middle">
<h:outputStylesheet name="css/style.css" />
</f:facet>
</h:head>
<h:body>
<p:layout fullPage="true" resizeTitle="resize">
<p:layoutUnit position="north" id="north" size="60" resizable="false">
<ui:include src="header.xhtml" />
</p:layoutUnit>
<p:layoutUnit id="west" position="west" size="220" resizable="false" gutter="2" header="Actions" effect="slide" collapsible="true" >
<ui:include src="menu.xhtml" />
</p:layoutUnit>
<p:layoutUnit id="center" styleClass="layoutUnitCenter" position="center" resizable="false">
<!-- For PrimeFaces <= 6.1 -->
<!--
<p:messages id="msgs" showSummary="true" autoUpdate="true" />
<ui:insert name="content" />
-->
<!-- For PrimeFaces == 6.2 -->
<p:fragment>
<p:messages id="msgs" showSummary="true">
<p:autoUpdate />
</p:messages>
</p:fragment>
<ui:insert name="content" />
</p:layoutUnit>
<p:layoutUnit position="south" resizable="false" id="south" closable="false" collapsible="false">
<ui:include src="footer.xhtml" />
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
</html>
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
id="WebApp_ID" version="3.1">
<display-name>Project</display-name>
<context-param>
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>server</param-value>
</context-param>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
<enabled>true</enabled>
<async-supported>false</async-supported>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
</web-app>
There is a bug in PrimeFaces 6.2 that cause this issue.
The bug is reported and is resolved in PrimeFaces 6.2.1
More info can be found here: https://github.com/primefaces/primefaces/issues/3457
As melloware mention in the link above, adding the following code in web.xml solves this issue.
<context-param>
<param-name>primefaces.MOVE_SCRIPTS_TO_BOTTOM</param-name>
<param-value>true</param-value>
</context-param>
来源：https://stackoverflow.com/questions/49980465/ui-layout-initialization-error-primefaces-6-2