JSF 2.0 com primefaces - Erro no template e p:dialog

Front-end
#1

Olá, estou começando a trabalhar com jsf e primefaces e estou enfrentando um problema que aparentemente parece bobo, mas não estou conseguindo decifar onde está o erro.
Conto com a ajuda de vocês.

O erros são os seguintes:
1 - criei um template padrão e as paginas que o utilizam estão quase perfeitas a não ser pelo fato de as imagens do skin que baixei do site do primefaces não carregam.
2 - Utilizando esse mesmo template criei um form que tem uma dataTable e um botão para inserir um novo registro, criei um p:dialog modal, e quando ele aparece toda a tela fica inacessivel inclusive o p:dialog, se alguem puder me ajudar agradeço.
Segue o código

templateMaster.xhtml

Loja virtual 
<p:resources/>

</h:head>
<h:body style=“font-size:11px; border: 0px”>
<h:outputStylesheet name=“css/skin.css” />
<p:layout fullPage=“true”>
<p:layoutUnit position=“top” height=“100” header=“cabecalho”>

	</p:layoutUnit>

	<p:layoutUnit position="left" width="160" header="Menu">
		<ui:include src="/admin/menuEsquerdo.xhtml" />
	</p:layoutUnit>
	<p:layoutUnit position="center">
		<ui:insert name="conteudo"/>
	</p:layoutUnit>

	<p:layoutUnit position="bottom" height="50" header="rodape">
	
	
	</p:layoutUnit>
</p:layout>

</h:body>
</f:view>

MenuEsquerdo.xhtml

<ui:composition>
	<p:menu>
		<p:submenu>
			<p:menuitem value="Home" url="/admin/index.xhtml"/>
			<p:menuitem value="Categoria" url="/admin/categoria.xhtml"/>
		</p:submenu>
	</p:menu>
</ui:composition>

cadastro.xhtml

<ui:composition template="/templates/templateMaster.xhtml">
<ui:define name=“conteudo”>
<h:form prependId=“false”>
<p:panel header=“Lista de categorias”>
<p:commandButton value=“Novo” ajax=“true” update=“panel” oncomplete=“cadastro.show();”/>
</p:panel>
</h:form>

	<p:dialog widgetVar="cadastro" id="cadastro"  position="center" >
		<p:panel id="panel" header="Cadastro de categorias" footer="" >
			<h:outputLabel value="Descrição: *" for="descricao" />
		</p:panel>
	</p:dialog>
</ui:define>

</ui:composition>

#2

Rjunior, eu posso te ajudar no problema do <p:dialog> Eu ja passei por esse problema. Uma solção é colocar o dialog no template fora dos tags do layout da seguinte manera

[code]templateMaster.xhtml

Loja virtual

<p:resources/>

</h:head>
<h:body style=“font-size:11px; border: 0px”>
<h:outputStylesheet name=“css/skin.css” />
<p:layout fullPage=“true”>
<p:layoutUnit position=“top” height=“100” header=“cabecalho”>

</p:layoutUnit>

<p:layoutUnit position=“left” width=“160” header=“Menu”>
<ui:include src="/admin/menuEsquerdo.xhtml" />
</p:layoutUnit>
<p:layoutUnit position=“center”>
<ui:insert name=“conteudo”/>
</p:layoutUnit>

<p:layoutUnit position=“bottom” height=“50” header=“rodape”>

</p:layoutUnit>
</p:layout>

<p:dialog widgetVar=“cadastro” id=“cadastro” position=“center” >
<p:panel id=“panel” header=“Cadastro de categorias” footer="" >
<h:outputLabel value=“Descrição: *” for=“descricao” />
</p:panel>
</p:dialog>

</h:body>
</f:view>

MenuEsquerdo.xhtml

ui:composition
<p:menu>
<p:submenu>
<p:menuitem value=“Home” url="/admin/index.xhtml"/>
<p:menuitem value=“Categoria” url="/admin/categoria.xhtml"/>
</p:submenu>
</p:menu>
</ui:composition>

cadastro.xhtml

<ui:composition template="/templates/templateMaster.xhtml">
<ui:define name=“conteudo”>
<h:form prependId=“false”>
<p:panel header=“Lista de categorias”>
<p:commandButton value=“Novo” ajax=“true” update=“panel” oncomplete=“cadastro.show();”/>
</p:panel>
</h:form>

</ui:define>
</ui:composition>

[/code]

Facundo Larrosa
www.sasex.com.br

#3

Na documentação do primefaces para o JSF 2 diz q não pode mais utilizar a tag p:resources. Deve apenas conter na página a tag h:head.

No JSF 2, se não me engano, não se usa a tag f:view.

#4

Obrigado Facundo, só me tira uma dúvida. O arquivo onde está o dialog é um arquivo aparte e eu utilizo o template para que na parte central do layout seja exibido o cadastro. Então como você resolveu o seu problema?

#5

Junior, não entendi sua pergunta, não funcionou fazendo o que eu sugeri? O dialog ficaria no template, ee o template e carregado antes de carregar cadastro.xhtml, de esta manera o p:dialog que é carregado lado do cliente fica pronto antes de ser chamado por o cadastro. Não resolveu ainda nada?

Facundo Larrosa
www.sasex.com.br

#6

Facundo, eu desisti de usar o layout do primefaces, e estou utilizando divs, e com o mesmo esta funcionando.
Com o layout do primefaces tanto o template como o dialog ficavam inativos.

Agora estou sofrendo com as images do primefaces que não aparecem utilizando os skins do site.

Estou colocando o <h:outputStyleSheet no template e somente as cores de background aparecem, já as imagens não aparecem de forma alguma.

Obs: coloquei o comando apos o body do template.

#7

Desculpa a demora, muita correría. Agora , me deixa pensando que que você não consegueu aquelo . Sua observação na que fala que o comando foi colocado fora dos tags do body, se você estaria falando do <h:outputStyleSheet ? Se for assim eu nunca usei esse comando , eu simplesmente coloco o parametro “style” para definir estilos de algums itens em particular , ou assigno-le uma “styleClass” e defino a classe no head ou um outro archivo assignado por o sempre <link …> no head.
As veces tambem ajuda muito usar o plug-in firebug do mozzilla, para analisar de onde esta recebendo o estilo cada elemento, ja usou ele? Facilita muito no caso de primefaces.

Facundo Larrosa.
SASEX - Soluções em Transporte e Logísitca

#8

Vou verificar, obrigado.

#9

Olá, estou desenvolvendo uma aplicação e me deparei com seu mesmo problema, resolvi inserindo appendToBody=“true” no dialog.
Ficando assim:
<p:dialog header="#{msgs.relacaoPessoas}" widgetVar=“dlgPessoas” modal=“true” appendToBody=“true”>
</p:dialog>

#10