Desalinhamento do topo e rodapé com o conteúdo do grid no datatable no primefaces

Programação
#1

Olá boa tarde galerinha, estive implementando o datatable, porém como tenho muitos campos acabou que causou um desalinhamento no conteúdo do datatable com o topo e o rodapé, já tentei várias coisas mas nao consigo deixar o topo e o rodapé dinamicos para aumentar conforme for aumentando também o conteúdo da grade por causa das inúmeras colunas. Amigos, se alguém souber uma forma para resolver esse problema ficarei muito agradecido. Obrigado.

         <h:form>
		<p:toolbar>
			<f:facet name="left">
				<h:outputText value="Pesquisa de Empresa"/>
			</f:facet>
		</p:toolbar>


		<h:panelGrid columns="1">
		</h:panelGrid>

		<p:dataTable emptyMessage="Nenhum registro encontrado !"
			value="#{empresaBean.listaEmpresas}"
			filteredValue="#{empresaBean.listaEmpresasFiltradas}" var="empresa"
			rows="10" paginator="true">

			<f:facet name="footer">
				<p:commandButton value="Novo"
					action="/pages/empresaCadastro.xhtml?faces-redirect=true" />
			</f:facet>

			<p:column headerText="Código" style="width: 80px">
				<h:outputText value="#{empresa.emp_Id}" />
			</p:column>

			<p:column headerText="Razão Social" style="width: 380px">
				<h:outputText value="#{empresa.emp_Razao}" />
			</p:column>

			<p:column headerText="Nome Fantasia" filterBy="#{empresa.emp_NomeFantasia}"
				sortBy="#{empresa.emp_NomeFantasia}" style="width: 380px">
				<h:outputText value="#{empresa.emp_NomeFantasia}" />
			</p:column>

			<p:column headerText="CNPJ" style="width: 200px">
				<h:outputText value="#{empresa.emp_Cnpj}" />
			</p:column>

			<p:column headerText="Endereço" style="width: 300px">
				<h:outputText value="#{empresa.emp_Endereco}" />
			</p:column>

			<p:column headerText="Cidade" filterBy="#{empresa.emp_Cidade}"
				sortBy="#{empresa.emp_Cidade}" style="width: 280px">
				<h:outputText value="#{empresa.emp_Cidade}" />
			</p:column>

			<p:column headerText="Proprietário" style="width: 200px">
				<h:outputText value="#{empresa.emp_Proprietario}" />
			</p:column>

			<p:column headerText="Telefone 1" style="width: 150px">
				<h:outputText value="#{empresa.emp_Tel1}" />
			</p:column>

			<p:column headerText="Telefone 2" style="width: 150px">
				<h:outputText value="#{empresa.emp_Tel2}" />
			</p:column>

			<p:column headerText="Celular 1" style="width: 170px">
				<h:outputText value="#{empresa.emp_Cel1}" />
			</p:column>

			<p:column headerText="Celular 2" style="width: 170px">
				<h:outputText value="#{empresa.emp_Cel2}" />
			</p:column>

			<p:column headerText="Observação" style="width: 550px">
				<h:outputText value="#{empresa.emp_Observacao}" />
			</p:column>

			<p:column headerText="Opções">
			</p:column>
		</p:dataTable>

	</h:form>

1
1.JPG1268×680 55.8 KB

#2

Acho que vc vai ter que usar o dataTable com scroll, pois o primefaces quando renderiza a tela usa a largura disponível pra criar o header e o footer.

1 curtida
#3

Deu certo, muito obrigado !!