Dialog with datatable is not displayed

Asked

Viewed 162 times

0

I have a dialog with a dataTable, However, when you click the button that should open it, this does not happen.

He also owns a dataTable within it that should have respective values the line in which it corresponds in the dataTable. Could you tell me why this happens?

<p:commandButton value="Buscar" action="#{ocorrenciaViewMB.obterOcorrencia}" ajax="true" update=":form"></p:commandButton>
    <p:dataTable var="ocorrencia" value="#{ocorrenciaViewMB.listaocorrencia}" emptyMessage="Nenhuma ocorrência de risco encontrada." widgetVar="riscoTabela" sortMode="multiple" draggableColumns="true"
     draggableRows="true" resizableColumns="true" caseSensitiveSort="false">
        <f:facet name="header">
            <p:outputPanel>     
                <h:outputText value="#{msgs.OcorrenciasDeRisco}" />            
            </p:outputPanel>
        </f:facet>
        <p:column headerText="#{msgs.Codigo}" colspan="1"
                 sortBy="#{ocorrencia.codigo}">
            <h:outputText value="#{ocorrencia.codigo}" />
        </p:column>
        <p:column style="width:32px;text-align: center">
            <p:commandButton  value="Modal" type="button"  oncick="PF('modal').show();" />
        </p:column>
        <p:dialog header="Danos" closeOnEscape="true" showEffect="fade" position="center" hideEffect="explode" widgetVar="modal"  id="modal" modal="true" height="50">
            <p:dataTable var="dano"  id="dataTableDano" value="#{ocorrencia.listaDeDanos}" emptyMessage="Nenhum encontrado." sortMode="multiple" draggableColumns="true" draggableRows="true" resizableColumns="true" caseSensitiveSort="false">
                <h:outputText value="Código" />
                <h:outputText value="#{dano.codigo}" />
                <h:outputText value="Descrição" />
                <h:outputText value="#{dano.descricao}" />
            </p:dataTable>
        </p:dialog> 
    </p:dataTable>
  • Correct the writing of onclick on the button that will update the dialog to onclick. Once done, set a false ajax on your button. You are also missing a call that updates your dialog, since you should take dynamic values according to the row selected in the table.

1 answer

0

Pass the <p:Dialog out of the </p:dataTable> then change onClick to oncomplete="PF('modal').show()"

your code will look like this. Take the test and see if it works that way.

    <p:commandButton value="Buscar" action="#{ocorrenciaViewMB.obterOcorrencia}" ajax="true" update=":form"></p:commandButton>
        <p:dataTable var="ocorrencia" value="#{ocorrenciaViewMB.listaocorrencia}" emptyMessage="Nenhuma ocorrência de risco encontrada." widgetVar="riscoTabela" sortMode="multiple" draggableColumns="true"
         draggableRows="true" resizableColumns="true" caseSensitiveSort="false">
            <f:facet name="header">
                <p:outputPanel>     
                    <h:outputText value="#{msgs.OcorrenciasDeRisco}" />            
                </p:outputPanel>
            </f:facet>
            <p:column headerText="#{msgs.Codigo}" colspan="1"
                     sortBy="#{ocorrencia.codigo}">
                <h:outputText value="#{ocorrencia.codigo}" />
            </p:column>
            <p:column style="width:32px;text-align: center">
                <p:commandButton  value="Modal" type="button"  oncomplete="PF('modal').show();" />
            </p:column>

        </p:dataTable>

<p:dialog header="Danos" closeOnEscape="true" showEffect="fade" position="center" hideEffect="explode" widgetVar="modal"  id="modal" modal="true" height="50">
                <p:dataTable var="dano"  id="dataTableDano" value="#{ocorrencia.listaDeDanos}" emptyMessage="Nenhum encontrado." sortMode="multiple" draggableColumns="true" draggableRows="true" resizableColumns="true" caseSensitiveSort="false">
                    <h:outputText value="Código" />
                    <h:outputText value="#{dano.codigo}" />
                    <h:outputText value="Descrição" />
                    <h:outputText value="#{dano.descricao}" />
                </p:dataTable>
            </p:dialog> 

Do a test by putting modal="false" and see if it works too.

Browser other questions tagged

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