Problema de renderização no primefaces

Front-end
#1

pessoal estou usando o primefaces rc2, com mojarra 2.0.3 eestou tendo problemas
de renderização na realização de includes dinamicos, com o prime.
ja testei com o tomcat 7.0.5 e glassfish 3.0.1 e netbeans 6.9

ja teste nos dois conteines executando pelo ide e pela linha de comando mais o problema
de renderização continua. as pagina incluidas dinamicamentes não são carregadas
completatamentes quando do um f5 tudo funciona normal, porem sem o f5 tenho problema
com dialog, tables, e outros componentes não são carregados direito.

segui os codigos:

meus indexTemplate.xhtml

<?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:p="http://primefaces.prime.com.tr/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <title>Guiaki - Informação na Mão</title>
        <link type="text/css" rel="stylesheet" href="./themes/skin.css"/>        
    </h:head>
    <h:body style="background: #c6deff">
        <p:panel  header="C6 - Soluções em Tecnologia" style="width: 1200px; min-width: 1200px; min-height: 550px; margin: 0 auto;">

            <h:panelGrid columns="1" style="width: 100%">

                <ui:insert name="dadosUsuario"/>

                <ui:insert name="menu"/>

                <ui:insert name="conteudo"/>
                
            </h:panelGrid>
            
        </p:panel>
    </h:body>
</html>

meu index.xhtml

<?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:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui">

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

        <ui:define name="dadosUsuario">
           
        </ui:define>

        <ui:define name="menu">
            <ui:include src="barra-menu.xhtml"/>
        </ui:define>

        <ui:define name="conteudo">
            
            <h:panelGrid columns="1" style="width: 100%">
                <p:outputPanel id="center">
                    <p/>
                    <center>
                        <ui:include src="#{controllerPage.page}"/>                        
                    </center>
                </p:outputPanel>
            </h:panelGrid>
            
        </ui:define>

    </ui:composition>

</html>

a barra de menu.

<?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:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">    
    
    <h:form>
        <p:menubar>

            <p:submenu>
                <f:facet name="label">
                    <p:menuitem value="Home" action="#{controllerPage.setHome}" update="center">

                    </p:menuitem>
                </f:facet>
            </p:submenu>
            <p:submenu label="Clientes">
                <p:menuitem value="Novo" action="#{controllerPage.setCliente}" update="center" target="center">

                </p:menuitem>
                <p:menuitem value="Editar" action="#{controllerPage.setOpcoesCliente}" update="center">

                </p:menuitem>
                <p:menuitem value="Deletar">

                </p:menuitem>
            </p:submenu>


            <p:submenu label="Assinaturas">

                <p:menuitem value="Novo" action="#{controllerPage.setAssinatura}" update="center">

                    </p:menuitem>
                    <p:menuitem value="Editar">

                    </p:menuitem>
                    <p:menuitem value="Deletar">

                    </p:menuitem>

            </p:submenu>

            <p:submenu label="Estabelecimentos">
                <p:menuitem value="Novo" action="#{controllerPage.setEstabelecimento}" update="center">

                </p:menuitem>
                <p:menuitem value="Editar">

                </p:menuitem>
                <p:menuitem value="Deletar">

                </p:menuitem>
            </p:submenu>

            <p:submenu label="Vendedores">
                <p:menuitem value="Novo" action="#{controllerPage.setVendedor}" update="center">

                </p:menuitem>
                <p:menuitem value="Editar">

                </p:menuitem>
                <p:menuitem value="Deletar">

                </p:menuitem>

            </p:submenu>

            <p:submenu label="Cidades">
                <p:menuitem value="Novo" action="#{controllerPage.setCidade}" update="center">

                </p:menuitem>
                <p:menuitem value="Editar">

                </p:menuitem>
                <p:menuitem value="Deletar">

                </p:menuitem>
            </p:submenu>

            <p:submenu label="Regiões">

                <p:menuitem value="Novo" action="#{controllerPage.setRegiao}" update="center">

                </p:menuitem>
                <p:menuitem value="Editar" action="#{controllerPage.setOpcoesRegiao}" update="center">

                </p:menuitem>


                <p:menuitem value="Deletar">

                </p:menuitem>

            </p:submenu>

            <p:submenu label="Guiaki">

                <p:submenu label="Categoria">

                    <p:menuitem value="Novo" action="#{controllerPage.setCategoria}" update="center">
                    </p:menuitem>

                    <p:menuitem value="Editar">
                    </p:menuitem>

                    <p:menuitem value="Deletar">
                    </p:menuitem>

                </p:submenu>

                <p:submenu label="Sub Categoria">

                    <p:menuitem value="Novo" action="#{controllerPage.setSubCategoria}" update="center">
                    </p:menuitem>

                    <p:menuitem value="Editar">
                    </p:menuitem>

                    <p:menuitem value="Deletar">
                    </p:menuitem>

                </p:submenu>                

            </p:submenu>


            <p:submenu>
                <f:facet name="label">
                    <p:menuitem value="Logout" action="#{controllerPage.logout}" ajax="false"/>
                </f:facet>
            </p:submenu>

        </p:menubar>
    </h:form>


</html>

exemplo de um arquivo incluido dinamicamente:

<?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:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">


    <h:form>
        <p:panel id="regiao-panel" closable="false" header="Cadastro de Regiões" style="width: 800px">
            
            <h:panelGrid columns="3" cellpadding="4" cellspacing="8">
                
                <h:outputLabel value="Nome: *" for="regiao-nome"/>
                <h:inputText id="regiao-nome" value="#{regiaoBean.regiao.nome}" size="45" required="true" requiredMessage="O Campo [Nome] é obrigatório.">
                </h:inputText>
                <p:message for="regiao-nome">
                    <p:effect event="load" type="pulsate">
                        <f:param name="mode" value="'Show'"/>
                    </p:effect>
                </p:message>

                <h:outputLabel value="Estado: *" for="regiao-estado"/>
                <h:selectOneMenu id="regiao-estado" value="#{regiaoBean.estado.uf}" required="true" requiredMessage="O Campo [Estado] é obrigatório.">
                    <f:selectItem itemLabel="Selecione o Estado"/>
                    <f:selectItems
                        value="#{estadoBean.estados}"
                        var="estado"
                        itemLabel="#{estado.nome}"
                        itemValue="#{estado.uf}"/>
                </h:selectOneMenu>
                <p:message for="regiao-estado">
                    <p:effect event="load" type="pulsate">
                        <f:param name="mode" value="'Show'"/>
                    </p:effect>
                </p:message>
                
            </h:panelGrid>

            <center>
                <p:commandButton style="width: 100px" value="Salvar" update="regiao-panel" action="#{regiaoBean.salvar}" />
            </center>
            
        </p:panel>
    </h:form>

</html>

ai pessoal o que pode ser ja use o mojarra 2.0.4 e tambem da no mesmo.

#2

iai pessoal deu para entender a pergunta.
esta acontecendo o seguinte guando faço uso
do ajax para atualizar a região central da pagina
ele não carrega por completo tenho problemas com
actions, datatable, dialo e outros.

alguem ja passou por isso.

#3

Rapaz, Tb passei por este perrengue! Até desisti por enquanto desse negócio.

        Algumas pessoas aqui ficam dizendo que fizeram todos os testes possíveis e nada de resolver!

Fiz muita coisa pra resolver este problema…vou resolver outras coisas aqui e quem sabe alguem realmente faça testes e resolva essa parada!

Valews!

#4

rapaz tentei tudo que imaginei e nada de resolver
então desisti dos includes dinamicos.

agora estou dando reload na pagina toda.

fica mais lento, mas fazer o que.

vlw.

#5

tive problemas com perca de desempenho ao utilizar ajax para renderizar componentes em paginas utilizando a tag p:ajax do primefaces

Porém resolvi tudo trocando o p:ajax por f:ajax ,
Como o ajax é nativo do jsf a tag f:ajax tem essa vantagem
ja a do primefaces pelo que entedi sobrescreve o ajax do jsf o que dexa mais lento a renderização e caso ocorra problema ate a má renderização da pagina…
Não tenho ctz se o p:ajax do primefaces funciona desta forma mesmo só estou comentando o que li em blogs.

fica a dica!

#6

cara as vezes o f:ajax não renderiza direito os componentes
do primefaces. pelo menos em meus testes.
não sei ao certo mas ja aconteceu de o componente so renderizar
completamente com o p:ajax

#7

tente fazer o seguinte com o f:ajax

 public void nomeMetodo(AjaxBehaviorEvent event) throws AbortProcessingException {
        //Instruções

    }

Esta assinatura vc usa quando precisa disparar um metodo por ajax…

#8

Olá Fernando,

  Vc está usando ui:include dinâmico? Renderizando somente partes da página?
#9

Cara quando comecei meu projeto ate usei,
Mais depois de um tempo eu desisti de usar pois estava tendo problema com modal,

#10

Eu tenho um tópico exatamente para mesma dúvida. :evil:

Já tentei de tudo, muito bizarro…

#11

então eu desisti de usar include dinamico por isso aii,
vi muita gente falando que dava pal em tudo,

Eu optei por renderizar pagina a partir de uma seleção, e funciona bem principalmente no meu caso que tenho varios modal em uma unica pagina!
de repente seria uma solução pra vcs tambem!

#12

[quote=fernandogodoy18]então eu desisti de usar include dinamico por isso aii,
vi muita gente falando que dava pal em tudo,

Eu optei por renderizar pagina a partir de uma seleção, e funciona bem principalmente no meu caso que tenho varios modal em uma unica pagina!
de repente seria uma solução pra vcs tambem![/quote]

Então, como vc faz ? como assim por seleção ?

#13

No meu caso deu pra aplicar esse por seleção por causa da regra de negocio,
mais a ideia é simples.

você pode cria um selectOneMenu ou selectOneRadio por exemplo;
e seu form vc envolve em um panel,
quando selecionado a opção vc manda rendezira o panel…

nada complicado,
isso eh um exemplo fulerinha!
só pra simplificar a ideia!

#14

[quote=fernandogodoy18]No meu caso deu pra aplicar esse por seleção por causa da regra de negocio,
mais a ideia é simples.

você pode cria um selectOneMenu ou selectOneRadio por exemplo;
e seu form vc envolve em um panel,
quando selecionado a opção vc manda rendezira o panel…

nada complicado,
isso eh um exemplo fulerinha!
só pra simplificar a ideia![/quote]

Mas funciona mesmo com o panel rederizado dinamicamente, o ajax do prime funciona no formulário ?
Vou testar denovo… Ahh Outra coisa, já aconteceu de vc usar o rendered e o maldito panel não fechar, mesmo com o rendered vira false ?

Abraços

#15

também estou com alguns problemas com ajax.
mas só um detalhe que reparei…
esse trecho do código foi depreciado…

[code] <f:facet name=“label”>
<p:menuitem value=“Home” action="#{controllerPage.setHome}" update=“center”>

                 &lt;/p:menuitem&gt;  
             &lt;/f:facet&gt;[/code]

Depois dá um analisada nisto.

#16

Clebio…
Funciona perfeitamente, eu tenho em alguns casos o seguinte
um SelectOneMenu que ao selecionado renderiza mais 3 que dependendo da opção podem selecionar varios campos que utilizar ajax,
como exemplo de calculo onde eu preencho o valor em alguns campos e por ajax rendeziro outro com o valor total…

Desde que esteja sendo renderizado certo nunca acontenceu de não renderizar!
tanto com o panel quanto com panelgrid e o fieldset

E Mr. Style

faço da seguinte forma:

<p:submenu label="CADASTRO">
   <p:menuitem value="NomeCadastro" url="URLCadastro"></p:menuitem>
</p:submenu>
#17

[quote=fernandogodoy18]Clebio…
Funciona perfeitamente, eu tenho em alguns casos o seguinte
um SelectOneMenu que ao selecionado renderiza mais 3 que dependendo da opção podem selecionar varios campos que utilizar ajax,
como exemplo de calculo onde eu preencho o valor em alguns campos e por ajax rendeziro outro com o valor total…

Desde que esteja sendo renderizado certo nunca acontenceu de não renderizar!
tanto com o panel quanto com panelgrid e o fieldset

E Mr. Style

faço da seguinte forma:

<p:submenu label="CADASTRO"> <p:menuitem value="NomeCadastro" url="URLCadastro"></p:menuitem> </p:submenu> [/quote]

Fiz um ultimo teste aqui. Olha só isso. :shock:

Se eu usar o ajax do primefaces ele caga pro meu botão, se eu colocar como no código abaixo, NÃO funciona.
Olha o final do meu código.

<p:commandButton id="btnSalvar" value="Gravar" actionListener="#{usuarioBean.grava}" update="@form"/>

[color=blue]ISSO AQUI FUNCIONA PESSOAL, chupa essa manga !!![/color]

					<p:commandButton id="btnSalvar" value="Gravar" ajax="false"
						actionListener="#{usuarioBean.grava}"
						update="@form">
						<f:ajax render="formUsuarioCad" />
					</p:commandButton>

	<h:form id="formMenu">
		<p:growl showDetail="true" sticky="true"/>	
		<p:menubar>
			<p:submenu label="Iniciar">
				<p:menuitem value="Início"  action="#{menuController.setPrincipal}" url="mainpage.xhtml" ajax="false"/>
				<p:menuitem value="Logout"  action="#{loginBean.doLogout}" ajax="false"/>								
			</p:submenu>
			<p:submenu label="Cadastro">
				<p:menuitem value="Usuários"    action="#{menuController.chamaUsuario}"    ajax="false"/>
				
				<p:menuitem value="Usuários teste"  action="#{menuController.setUsuario}"  update="bola"/>
								
				<p:menuitem value="Questões"    action="#{menuController.setQuestao}"      ajax="false" />				
				<p:menuitem value="Compilação"  action="#{menuController.setCompilacao}"   ajax="false" />
				<p:menuitem value="Professores" action="#{menuController.setProfessor}"    ajax="false" />					
				<p:menuitem value="Disciplinas" action="#{menuController.chamaDisciplina}" ajax="false"/>
			</p:submenu>
			<p:submenu label="Configurações">
				<p:menuitem value="Sobre o Sistema"/>				
			</p:submenu>
		</p:menubar>
	</h:form>		
	

	<p:outputPanel id="bola" >

		<h:form id="formUsuarioCad" rendered="#{menuController.paginaAtual=='usuario'}">
			<p:panel id="xota" closable="true" header="Cadastro de Usuário">

				<h:panelGrid columns="2">
					<h:outputLabel value="Código:"
						rendered="#{usuarioBean.usuario.id != null}" />

					<p:inputText id="codigo" value="#{usuarioBean.usuario.id}"
						rendered="#{usuarioBean.usuario.id != null}" />

					<h:outputLabel value="Nome p/ Login:" />

					<p:inputText id="login" required="true"
						value="#{usuarioBean.usuario.login}"
						requiredMessage="Campo [Nome p/ login] obrigatório" />

					<h:outputLabel value="Senha:" />

					<p:password value="#{usuarioBean.usuario.senha}" minLength="6"
						promptLabel="Digite uma senha segura" goodLabel="Boa"
						weakLabel="Razoável" strongLabel="Excelente" />

					<p:commandButton id="btnSalvar" value="Gravar" ajax="false"
						actionListener="#{usuarioBean.grava}"
						update="@form">
						<f:ajax render="formUsuarioCad" />
					</p:commandButton>

				</h:panelGrid>
			</p:panel>
		</h:form>
		
	</p:outputPanel>
#18 
 public void nomeMetodo(AjaxBehaviorEvent event) throws AbortProcessingException {  
        //Instruções  
   
    }

fernandogodoy18 rapaz o que deve ser colocado nas instruções.

#19

Clebio,

 Eu costumo deixar tudo dentro de um único form, ou seja, de cabo a rabo. Daí coloco no botão "process=id_componente" e "update=componente_de_saída". Isso funciona perfeitamente.
#20

vc vai colocar o que vc deseja que seu metodo execute…