Using data table with on demand feature within a dialog in primefaces

Asked

Viewed 593 times

0

I’m having trouble using a datatable of primefaces with that resource on demand. I try to use it inside a dialog but when opening with the data, but they are not updated and the scroll mouse moves the previous page because I am using modal = "true".

Has anyone ever done such a thing?

Code of dialog

<p:dialog header="#{lbl['LABEL.TABELATAXA.HISTRICODATABELA.HEADER']}"
    widgetVar="dlgLog" resizable="false" modal="true" height="500"
    width="1000" dynamic="true">
    <ui:include src="#{tabelaTaxasComissoesEmprestimoBean.viewLog}" />
</p:dialog>

Code of the Viewlog

<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"
      xmlns:p="http://primefaces.org/ui">

    <h:head/>

    <h:body>
        <p:dataTable var="log" value="#{tabelaTaxasComissoesEmprestimoBean.logs}"
            emptyMessage="#{lbl['LABEL.TABELATAXA.NAOHAREGISTROLOG.MSG']}"
            styleClass="dataTableNoWrap" scrollRows="15" scrollable="true"
            liveScroll="true" scrollHeight="400" scrollWidth="2500">

            <p:column headerText="#{lbl['LABEL.TABELATAXA.DATAHORA']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.dataHora}">
                    <f:convertDateTime pattern="dd/MM/yyyy - HH:mm" />
                </h:outputText>
            </p:column>

            <p:column headerText="#{lbl['LABEL.TABELATAXA.USUARIO']}">
                <h:outputText value="#{log.usuario.login}" />
            </p:column>

            <p:column headerText="#{lbl['LABEL.TABELATAXA.OPERACAO']}">
                <h:outputText value="#{log.operacao}" />
            </p:column>

            <p:column headerText="#{lbl['LABEL.TABELATAXA.DESATIVADO']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.desativada}" converter="boolConverter" />
            </p:column>

            <p:column headerText="#{lbl['LABEL.TABELATAXA.NOME']}">
                <h:outputText value="#{log.nome}" />
            </p:column>

            <p:column headerText="#{lbl['LABEL.TABELATAXA.DESATIVADA']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.desativada}" converter="boolConverter" />
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.TABELANAOPODESERVINCULADAASLOJAS']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.tabelaNaoPodeSerVinculadaLojas}" converter="boolConverter" />
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.TABELAEXCLUSIVACPGARANTIA']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.tabelaExclusivaParaCPGarantia}" converter="boolConverter" />
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.TABELAUTILIZADAFINANCIAMENTOVEICULOS']}"
                styleClass="columnCenter">
                <h:outputText value="#{log.tabelaUtilizadaParaFinanciamentoVeiculos}" converter="boolConverter" />
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.ANOFABRICACAODOVEICULO']}">
                <h:outputText value="#{log.anoFabricacaoVeiculoMin} - #{log.anoFabricacaoVeiculoMax}" />
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.FINANCIAMENTOPERMITIDOOVALORDOVEICULO']}"
                styleClass="columnRight">
                <h:outputText value="#{log.financiamentoPermitidoSobreValorVeiculo}">
                    <f:convertNumber locale="pt_BR" minFractionDigits="2"
                        maxFractionDigits="2" type="percent" />
                </h:outputText>
            </p:column>

            <p:column
                headerText="#{lbl['LABEL.TABELATAXA.ENDIVIDAMENTOPERMITIDOARENDA']}"
                styleClass="columnRight">
                <h:outputText value="#{log.endividamentoPermitidoSobreRenda}">
                    <f:convertNumber locale="pt_BR" minFractionDigits="2"
                        maxFractionDigits="2" type="percent" />
                </h:outputText>
            </p:column>

        </p:dataTable>
    </h:body>
</html>

I’m using the primefaces 4.0.

  • 1

    Post the code of datatableof dialog to facilitate. Used the update="idDoDataTable" in the element that opens the dialog?

  • Sorry for the delay in posting the code but I was on another demand and now I’m back to this, but here’s the thing, I’d like to know the relationship between the size of the dialog and the properties of datatable to use this type of table on demand.

1 answer

1

I managed to make the live scroll work by putting one appendTo="@(body)" at the p:dialog and increasing the number of table rows to 50: scrollRows="50". That is, a quantity that requires scroll.

With a small amount of lines the vertical scroll bar was not displayed and thus it was not possible to scroll to the end of the table to load more records.

  • What is that appendTo ago?

  • 1

    @Macario1983 O appendTo="@(body)" causes the HTML elements generated by the component p:dialog be added to body of the page, instead of being mixed with the component where the dialog is declared. This is sometimes desirable because the component containing the dialog may be hidden or have a position that negatively influences the behavior of the modal. On the other hand, put the dialogue in the body also makes the components within the dialogue outside the form current. This can help or disturb, and sometimes it is necessary to create another form

Browser other questions tagged

You are not signed in. Login or sign up in order to post.