title: JSF Primefaces and Bootsfaces
body: <p>I have a problem.</p>
  
  <p>I'm making a website with the layout of PrimeFaces, which loads a page in the center when I click on any menu item on the left, but when I use the theme of BootsFaces (<code>&lt;bnu: panel ....&gt; &lt;/bnu: panel&gt;</code>, page load in the center but it is not another load, when I do not use the theme, everything works fine but the panel shown in plain text without style look = "success" for example.</p>
  
  <pre><code>&lt;?xml version='1.0' encoding='UTF-8' ?&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:bnu="http://bootsfaces.net/ui"&gt;
      &lt;h:head&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
          &lt;title&gt;My Page&lt;/title&gt;
      &lt;/h:head&gt;
      &lt;h:body&gt;
          &lt;p:layout fullPage="true"&gt;
  
              &lt;p:layoutUnit position="north" size="100" resizable="false" closable="false" collapsible="false" &gt;
                  &lt;h1&gt;PAGE&lt;/h1&gt;
  
              &lt;/p:layoutUnit&gt;
  
  
              &lt;p:layoutUnit position="west" size="195" header="Panel" resizable="true" closable="false" collapsible="true" &gt;
                  &lt;h:form id="form" &gt;
  
                      &lt;p:menu&gt;
                          &lt;p:menuitem id="abc" value="Inicio" action="#{bean.page0()}" update=":content:pcenter" /&gt;
                          &lt;p:submenu label="ABC" &gt;
                              &lt;p:menuitem id="X1" value="CC1" action="#{bean.page1()}" update=":content:pcenter"/&gt;
                              &lt;p:menuitem id="X2" value="CC2" action="#{bean.page2()}" update=":content:pcenter"/&gt;
                              &lt;p:menuitem id="X3" value="CC3" action="#{bean.page3()}" update=":content:pcenter"/&gt;
                          &lt;/p:submenu&gt;
                      &lt;/p:menu&gt;
  
                  &lt;/h:form&gt;
              &lt;/p:layoutUnit&gt;
  
              &lt;p:layoutUnit position="center" header="Welcome user" &gt;
                  &lt;h:form id="content"&gt;
                      &lt;p:panel id="pcenter"&gt;
                          &lt;ui:include src="#{bean.page}.xhtml" /&gt;
                      &lt;/p:panel&gt;
                   &lt;/h:form&gt;
              &lt;/p:layoutUnit&gt;
  
              &lt;p:layoutUnit position="south" size="100" header="Bottom" resizable="false" closable="false" collapsible="false"&gt;
                  &lt;h:outputText value="South unit content." /&gt;
              &lt;/p:layoutUnit&gt;
  
          &lt;/p:layout&gt;         
      &lt;/h:body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I try this and not show the style look="success" but show the title</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:bnu="http://bootsfaces.net/ui"
        xmlns:f="http://xmlns.jcp.org/jsf/core"&gt;
  
      &lt;bnu:panel id="pdata" title="User data" collapsible="true" look="success"&gt;
             &lt;p:outputLabel value="Name" for="txt_name"/&gt;
                  &lt;p:inputText id="txt_name" label="Name" required="true"&gt;
                  &lt;/p:inputText&gt;
      &lt;/bnu:panel&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I try this, and the same</p>
  
  <pre><code>&lt;ui:composition xmlns="http://www.w3.org/1999/xhtml"
                  xmlns:h="http://java.sun.com/jsf/html"
                  xmlns:f="http://java.sun.com/jsf/core"
                  xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets"&gt;
  
      &lt;bnu:panel id="pdata" title="User data" collapsible="true" look="success"&gt;
             &lt;p:outputLabel value="Name" for="txt_name"/&gt;
                  &lt;p:inputText id="txt_name" label="Name" required="true"&gt;
                  &lt;/p:inputText&gt;
      &lt;/bnu:panel&gt;
  &lt;/ui:composition&gt;
  </code></pre>
  
  <p>And try this, working but after not load the pages in the center when click elements of left menu</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:bnu="http://bootsfaces.net/ui"
        xmlns:f="http://xmlns.jcp.org/jsf/core"&gt;
  
     &lt;head&gt;
     &lt;/head&gt;
      &lt;bnu:panel id="pdata" title="User data" collapsible="true" look="success"&gt;
             &lt;p:outputLabel value="Name" for="txt_name"/&gt;
                  &lt;p:inputText id="txt_name" label="Name" required="true"&gt;
                  &lt;/p:inputText&gt;
      &lt;/bnu:panel&gt;
  &lt;/html&gt;
  </code></pre>