Dialog do Primefaces ocupa espaço na tela quando está em modo Hide

Olá galera,

Precisei migrar uma aplicação para o Primefaces 3.4 e estou tendo um problema em relação ao componente p:dialog.

Ele está tomando um espaço da página antes de renderizar pela primeira vez.

Alguém já passou por isso?

Segue anexo o passo a passo com umas imagens que exemplifica melhor o que está acontecendo.

E aqui está o código do meu Xhtml.

<?xml version='1.0' encoding='UTF-8' ?>
<!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:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/template/template.xhtml">
	<ui:define name="titulo" />

	<ui:define name="principal">

		<p:panel>

			<center>

				<br />

				<h:outputText value="#{msg.manutencao_cliente}"
					style="font-size:large;
						font-weight:bold;" />

				<br /> <br />

				<p:dataTable value="#{manterEmpresaClienteBean.empresas}"
					var="empresa" style="width:60%;" id="tabela-cliente"
					paginator="true" rows="10"
					paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"
					rowsPerPageTemplate="5,10,15">

					<p:column headerText="#{msg.manutencao_cliente_codigo}"
						filterBy="#{empresa.idEmpresa}" filterMatchMode="startsWith"
						style="text-align:center;">
						<h:outputText value="#{empresa.idEmpresa}" />
					</p:column>

					<p:column headerText="#{msg.manuetencao_cliente_nome}"
						filterBy="#{empresa.nomeEmpresa}" filterMatchMode="startsWith">
						<h:outputText value="#{empresa.nomeEmpresa}" />
					</p:column>

					<p:column headerText="#{msg.manutencao_cliente_url}">
						<h:outputText value="#{empresa.urlDatabase}" />
					</p:column>

					<p:column headerText="#{msg.lbl_operacoes}"
						style="text-align:center;">

						<p:commandLink action="#{manterEmpresaClienteBean.excluirEmpresa}"
							title="#{msg.txt_excluir}" ajax="false"
							update=":tabela-cliente-form:tabela-cliente" style="margin:5px;"
							onclick="if(!confirm('Deseja excluir o cliente selecionado?')) return false;">

							<p:graphicImage value="/resources/imagens/excluir.PNG"
								width="20px" />

							<f:setPropertyActionListener
								target="#{manterEmpresaClienteBean.empresa}" value="#{empresa}" />

						</p:commandLink>

						<p:commandLink
							action="#{manterEmpresaClienteBean.navegarEditarCliente}"
							title="#{msg.txt_editar}" global="false" style="margin:5px;"
							update="form-cadastro-cliente" ajax="false">

							<p:graphicImage value="/resources/imagens/edit.png" width="20px" />

							<f:setPropertyActionListener
								target="#{manterEmpresaClienteBean.empresa}" value="#{empresa}" />

						</p:commandLink>

					</p:column>

				</p:dataTable>
				
				<br />

				<p:separator style="width:100%" />
				
				<p:commandButton value="#{msg.btn_incluir_cliente}"
					onclick="dlusuario.show()" ajax="true" />
				<p:separator style="width:100%" />

				<p:dialog header="#{msg.header_cadastrar_cliente}"
					widgetVar="dlusuario" modal="true" height="150" width="450"
					resizable="false">


					<h:form id="form-cadastro-cliente">

						<center>
							<h:inputHidden
								value="#{manterEmpresaClienteBean.empresa.idEmpresa}" />
							<h:panelGrid columns="2" style="width:100%">

								<h:outputText value="#{msg.lbl_cadastrar_cliente_nome} " />
								<h:inputText onkeypress="return somente_txt(event);"
									style="width:175px;"
									value="#{manterEmpresaClienteBean.empresa.nomeEmpresa}" />

								<h:outputText value="#{msg.lbl_cadastrar_cliente_url} " />
								<h:inputText style="width:175px;"
									value="#{manterEmpresaClienteBean.empresa.urlDatabase}" />

							</h:panelGrid>

							<p:separator style="width:100%" />
							<h:panelGrid columns="2">

								<p:commandButton value="#{msg.btn_salvar}"
									action="#{manterEmpresaClienteBean.salvarEmpresa}"
									update=":tabela-cliente-form:tabela-cliente" ajax="false" />


								<p:commandButton value="#{msg.btn_voltar}" ajax="false"
									action="#{manterEmpresaClienteBean.navegarManterClienteHome}" />
							</h:panelGrid>
							<p:separator style="width:100%" />

						</center>
					</h:form>

				</p:dialog>

				<br />

			</center>

		</p:panel>

	</ui:define>

</ui:composition>

</html>

Desde já, agradeço qualquer ajuda, pois estou batendo cabeça com isso a alguns dias.

4 Respostas

Topicos relacionados