HTML error rendering

f2pro · 09 Aug 2011, 21:07

Hello

I'm creating an interface using the <p:layout> component with Primefaces 3.0M2 with some includes like a header, footer and menu because these vary according to the pages.
But when logging, sometimes occurs html error rendering.
See my structure

template.xhtml

Code: Select all

<!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:p="http://primefaces.prime.com.tr/ui"  
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">  
    <h:head>  
        <title>
            <ui:insert name="titulo">SIGAE - Sistema de Gestão de Associação de Estudantes</ui:insert>  
        </title>  
        <link  
            href="painel.css"  
            rel="stylesheet" type="text/css" />  
    </h:head>  
    <h:body> 
        <f:metadata> 
            <f:event type="postAddToView" listener="#{secureAssociacao.estaLogado()}"/>
        </f:metadata>

        <p:layout fullPage="true">

            <p:layoutUnit position="north" size="80" style="border: 0px; margin: 0px; padding: 0px;">
                <ui:include src="topo.xhtml" />
                <div id="ffda"></div>
            </p:layoutUnit>

            <p:layoutUnit position="center" style="padding: 6px;">
                <ui:insert name="centro">
                </ui:insert>
            </p:layoutUnit>

            <p:layoutUnit position="west" header="Menu de Ações" resizable="true" collapsible="true" minSize="230" styleClass="fdp">
                <div style="background-color: #F5F5F5; height: inherit; border: 0px; margin: 0px; padding: 0px; margin-top: -2px; overflow: hidden;">
                    <ui:include src="menu.xhtml" />
                </div>
                <div id="ffdb"></div>
            </p:layoutUnit>

            <p:layoutUnit position="south" size="5" style="border: 0px; margin: 0px; padding: 0px;">
                <ui:include src="rodape.xhtml" />
            </p:layoutUnit>

            <ui:insert name="dialogo"></ui:insert>

        </p:layout>
    </h:body>  
</html>

The includes

topo.xhtml (header)

Code: Select all

<!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">
    <h:head>
        <title>SIGAE - Sistema de Gestão de Associação de Estudantes</title>
        <link rel="stylesheet" type="text/css" href="painel.css" />
    </h:head>
    <h:body>
        <f:metadata> 
            <f:event type="postAddToView" listener="#{secureAssociacao.estaLogado()}"/>
        </f:metadata>
        <table cellpadding="0" cellspacing="0" border="0" height="100%" width="100%" bgcolor="#f5f5f5">
            <tr>
                <td width="246" valign="bottom">
                    <div style="background-color: #F5F5F5; height: 78px; border: 0px; margin: 0px; padding: 0px; margin-top: -2px; overflow: hidden; float: left;">
                        <img border="0" src="../imagens/logopainel.png" style="position: absolute; margin-top: 13px; margin-left: 60px;"/>
                    </div>
                </td>
                <td valign="bottom">
                    <table width="99%">
                        <tr>
                            <td width="350">
                                Associação Logada:  <b>#{secureAssociacao.adm.associacao.nomefantasia}</b>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                Usuário Logado:  <b>#{secureAssociacao.adm.associado.nome}</b>
                            </td>
                            <td align="right">
                                <h:form>
                                    <h:commandLink style="text-decoration: none;" action="#{secureAssociacao.logout()}">
                                        <h:graphicImage url="http://cdn1.iconfinder.com/data/icons/crystalproject/24x24/actions/exit.png"/>
                                    </h:commandLink>
                                        
                                </h:form>
                            </td>
                        </tr>
                    </table>
                    
                </td>
            </tr>
        </table>
    </h:body>
</html>

menu.xhtml

Code: Select all

<!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:p="http://primefaces.prime.com.tr/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>SIGAE - Sistema de Gestão de Associação de Estudantes</title>
    </h:head>
    <f:metadata> 
        <f:event type="postAddToView" listener="#{secureAssociacao.verificaLogin()}"/>
    </f:metadata>
    <h:body>

        <h:form>
            <p:accordionPanel activeIndex="#{menuMB.menuAtivo}" autoHeight="true">
                <p:tab title="Associação"> 
                    <p:menu style="width:190px; margin-left: -10px; margin-top: -10px; border: 0px;">  
                        <p:menuitem value="Associação" url="painelAssociacao.xhtml?mA=0" icon="ui-icon ui-icon-disk"/> 
                        <p:menuitem value="Diretoria" url="painelDiretoria.xhtml?mA=0"  icon="ui-icon ui-icon-disk"/> 
                    </p:menu>  
                </p:tab>

               <p:tab title="Estudante">
                    <p:menu style="width:190px; margin-left: -10px; margin-top: -10px; border: 0px;">  
                        <p:menuitem value="Estudante" url="painelAssociado.xhtml?mA=1" icon="ui-icon ui-icon-disk"/>  
                        <p:menuitem value="Carteirinhas" url="relCarteirinhas.xhtml?mA=2" target="_blank" icon="ui-icon ui-icon-disk"/>
                    </p:menu>
                </p:tab>
                
                <p:tab title="Relatórios">
                    <p:menu style="width:190px; margin-left: -10px; margin-top: -10px; border: 0px;">  
                        <p:menuitem value="Estudantes" url="relEstudantes.xhtml?mA=2" target="_blank"  icon="ui-icon ui-icon-disk"/> 
                        <p:menuitem value="Paradas"  url="relParadas.xhtml?mA=2" target="_blank" icon="ui-icon ui-icon-disk"/> 
                    </p:menu>
                </p:tab>
                
                <p:tab title="Financeiro">
                    <p:menu style="width:190px; margin-left: -10px; margin-top: -10px; border: 0px;">  
                        <p:menuitem value="Visualizar Débitos" url="painelDebitos.xhtml?mA=3"  icon="ui-icon ui-icon-disk"/> 
                    </p:menu>
                </p:tab>
 
                <p:tab title="Demais Cadastros">
                    <p:menu style="width:190px; margin-left: -10px; margin-top: -10px; border: 0px;">  
                        <p:menuitem value="Semestre Ativo" url="painelSemestreAtivo.xhtml?mA=4"  icon="ui-icon ui-icon-disk"/> 
                        <p:menuitem value="Paradas" url="painelParada.xhtml?mA=4"  icon="ui-icon ui-icon-disk"/>
                    </p:menu>
                </p:tab>
                
            </p:accordionPanel>
        </h:form>
    </h:body>
</html>

rodape.xhtml (footer)

Code: Select all

<!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">
    <h:head>
        <title>SIGAE - Sistema de Gestão de Associação de Estudantes</title>
        <link rel="stylesheet" type="text/css" href="painel.css" />
    </h:head>
    <f:metadata> 
        <f:event type="postAddToView" listener="#{secureAssociacao.estaLogado()}"/>
    </f:metadata>
    <h:body>
                <div style="background-color: #F5F5F5; height: 5px; border: 0px; margin: 0px; padding: 0px; margin-top: -2px;">
                </div>
    </h:body>
</html>

And the Page

painelInicial.xhtml

Code: Select all

<!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">
    
    <h:body>
        
        <f:metadata> 
            <f:event type="postAddToView" listener="#{secureAssociacao.estaLogado()}"/>
            <f:viewParam name="mA" value="#{menuMB.menuAtivo}" />
        </f:metadata>
        
        <ui:composition template="template.xhtml">

            <ui:define name="centro">
                

            </ui:define>
            

        </ui:composition> 

    </h:body>
</html>

My questions are:
1 - Is correct if I repeat the code:

Code: Select all

<!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">
    <h:head>
        <title>SIGAE - Sistema de Gestão de Associação de Estudantes</title>
        <link rel="stylesheet" type="text/css" href="painel.css" />
    </h:head>

in all pages?

2 - How can I do this page correctly

09 Aug 2011, 21:58

Use a facelets template if you are repeating same content across pages.

f2pro · 09 Aug 2011, 22:06

optimus.prime wrote:Use a facelets template if you are repeating same content across pages.

Where can I see an example about this?

HTML error rendering

Who is online