Facelets [Resolvido]

Front-end
#1

Pessoal vou pedir uma dica aqui para montar meu template, estou tendo dificuldades com isso. Gostaria que vcs pudessem me dar um toq sobre o meu exemplo.

Tenho 4 arquivos xhtml que se resumem em: menu.xhtml, topo.xhtml, rodape.xhtml e template.xhtml. Eu consegui montar todo meu template, mas no momento de chamar ele no index não to sabando montar. Segue um exemplo com meu topo.

Este arquivo topo.xhtml o conteúdo de topo:

[code]<?xml version="1.0" encoding="ISO-8859-1"?>

[/code]

Este arquivo template.xhtml é onde é incluído o topo:

[code]<?xml version="1.0" encoding="ISO-8859-1"?>

.::Projeto Base::. 
<style type="text/css">
.basestyle {
	color: #FFFFFF;
	font-size: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

h1 {
	font-size: 16px;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

body,td,p,input {
	font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
}

.navlinks {
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
}
</style>

			<ui:include src="menu.xhtml" />
			<ui:include src="rodape.xhtml" />
	</table>
</body>
[/code]

Este arquivo é o index.xhtml onde quero chamar o meu template:

[code]<?xml version="1.0" encoding="ISO-8859-1"?>

<ui:composition template="template/template.xhtml">
	<ui:define name="topo">
		
	</ui:define>
	<ui:define name="menu"></ui:define>
	<ui:define name="rodape"></ui:define>
</ui:composition>
[/code]

Qual é a forma correta de fazer, e o que está errado?

Grato!

#2

No template.xhtml você esta montando a estrutura da página e incluindo nela o topo, menu e rodape, você não deveria deixar um espaço nela para colocar o conteúdo da página por exemplo:

...
<tr align="center" valign="middle" bgcolor="#FFFFFF" bordercolor="#d80000">
    <ui:include src="topo.xhtml" />
</tr>

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

<ui:include src="menu.xhtml" />
<ui:include src="rodape.xhtml" />
...

e no index.xhtml vc coloca o valor do conteúdo

<?xml version="1.0" encoding="ISO-8859-1"?>  
<!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"  
         xmlns:ui="http://java.sun.com/jsf/facelets">  
  <body>
    <ui:composition template="template/template.xhtml">  
        <ui:define name="conteudo">  
            Aqui vai o texto do conteudo....
        </ui:define>  
  </body>
</html>
#3

O que geralmente a gente faz é incluir menu, topo e rodapé no template. As páginas que usam o template, como seu index, não precisam especificar menu, topo e rodapé de novo, pois a idéia do template é justamente não deixar isso repetitivo. Então na index, você aponta pro template e só preenche o corpo dele, que o conteúdo vai ficar no lugar do <ui:insert/>, ou se você tiver dado um nome específico pra uma área dentro do template e quiser colocar algo dentro dela, coloca esse conteúdo dentro de um <ui:define name=“nomeDaArea”> conteudo </ui:define>.

#4

Entendo, mas eu não consigo vizualizar o template no index.xhtml. Se eu deixar só código abaixo:

<ui:composition template="template/template.xhtml> ... </ui:composition>

O browser não exibe certas partes do conteúdo do template. Mas se eu acessar o endereço do template ai sim ele é exibido corretamente.

Exemplo: http://localhost:8080/MeuProjeto/template/template.xhtml

#5

Acho que sua página index.xhtml não está encontrando o template…

Coloca assim no index:

<ui:composition template="./template/template.xhtml">

</ui:composition>
#6

O meu esta assim, o index…

[code]

"OpenExpert" [/code]

O layout.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">
<head>
  <title><ui:insert name="title">Default Title</ui:insert></title>
  <link rel="stylesheet" type="text/css" href="./css/main.css"/>
</head>

<body>

<div id="header">
    <ui:insert name="header">
    	<ui:include src="top.xhtml"/>
    </ui:insert>
</div>


<!--<div id="left">
  <ui:insert name="navigation" >
    <ui:include src="navigation.xhtml"/>
  </ui:insert>
</div>
-->

<div id="center" style="overflow: auto;">
  <br />
  <span class="titleText"> <ui:insert name="title" /> </span>
  <hr />
  <ui:insert name="content">
  	<div>
    <ui:include src="content.xhtml"/>  
    </div>
  </ui:insert>
</div>
<!-- 
<div id="right">
  <ui:insert name="news">
    <ui:include src="news.xhtml"/>
  </ui:insert>
</div>
 -->
<div id="footer">
  <ui:insert name="footer">
    <ui:include src="footer.xhtml"/>  
  </ui:insert>
</div>

</body>

</html>
#7

toma cuidado com os caminhos que você colocar no template. Caminhos ficam relativos à pagina que usa o template, e não ao arquivo do template, e isso confunde um pouco, pois quando criamos o template muitas vezes colocamos os caminhos relativos pensando nele. Então a melhor coisa é você ter caminhos relativos ao contexto da sua aplicação, e não ao arquivo do template. Faça o teste e comente aqui.

#8

Bem o erro ainda persiste e não mudou nada em modificar para:

[code]<ui:composition template="./template/template.xhtml">

</ui:composition>[/code]

Acredito que esteja encontrando pois algumas partes da página é exibida, uns 5% de 100%. O resto é não aparece.

#9

sua pagina topo, menu e rodape devem estar dentro da pasta template.
eu acho que você tem que mudar na sua página template.xhtml os includes

<ui:include src="./template/menu.xhtml" />
#10

infelizmente continuou na mesma.

:frowning:

#11

Pessoal o problema estava na página de topo, as figuras estavam referenciadas de forma que não apareciam na página index, mas no template aparecia.
Agradeço a todos pela ajuda.

Grato!

#12