It works for me if I update to the latest primefaces jars.
In detail modify the webapps/ivy/WEB-INF/lib `webapps/ivy/WEB-INF/lib` folder as follows:
- add gson 2.2.4 `gson-2.2.4.jar` or newer
- replace primefaces-extensions-2.0.0.jar `primefaces-extensions-2.0.0.jar` with primefaces-extensions-3.2.0.jar`primefaces-extensions-3.2.0.jar`
- replace primefaces-5.0.4-ivy.jar `primefaces-5.0.4-ivy.jar` with primefaces-5.2.jar
![alt text][1]`primefaces-5.2.jar`
![updated lib directory][1]
Then the view is renderer like this:
![alt text][2]![browser showing layout][2]
Important is, that you do not forget the < h:head > section in your view. Otherwise javascript errors are logged into the browsers console and therefore the scripts that interpret your failing attributes will not work. So the complete view code that I used is:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:ic="http://ivyteam.ch/jsf/component"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions"
xmlns:pm="http://primefaces.org/mobile">
<h:head /><!-- required so that pe: can inject java scripts -->
<h:body>
<pe:layout fullPage="true">
<pe:layoutPane size="800" initClosed="true" closable="true"
position="north">
<h3>Test</h3>
</pe:layoutPane>
<pe:layoutPane position="center">
<h:form id="form">
<h:panelGrid columns="2">
<f:facet name="header">
<p:messages></p:messages>
</f:facet>
<p:outputLabel for="description" value="Description" />
<p:inputText id="description" value=""></p:inputText>
<p:outputLabel for="expire" value="Expire" />
<p:calendar id="expire" value="" pattern="dd.MM.yyyy HH:mm"
size="16">
<f:convertDateTime pattern="dd.MM.yyyy HH:mm" />
</p:calendar>
<p:commandButton actionListener="#{logic.close}" value="Proceed"
update="form" icon="ui-icon-check" />
</h:panelGrid>
</h:form>
</pe:layoutPane>
<pe:layoutPane position="east" size="50%" closable="true">
<iframe src="http://answers.axonivy.com/" height="100%" width="100%" />
</pe:layoutPane>
</pe:layout>
</h:body>
</html>
[1]: http://answers.axonivy.com/upfiles/latestPrimeFacesExtensionJars.png
[2]: http://answers.axonivy.com/upfiles/layoutedView.png