Primefaces dialog over dialog method not called

Question

I have a dialog to change an equipment type when I select a row from a datatable. This first dialog opens without problem, I can change the equipment normally.

When I click "Save", I open another dialog just to confirm the changes. In this new dialog, the button with id "confirmarSim" should call a backing bean method. The problem is that method is never called, but the oncomplete methods are executed (the two dialogs are closed).

The code is as follows:

<p:dialog header="Editar IP Cadastrado" id="dialog" styleClass="borderless" widgetVar="dlgEditar" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false" closable="false">

        <p:growl id="growlInformacao" sticky="true" />

        <p:panelGrid columns="2" rendered="#{not empty cadastrosIPsBean.selectedCadastro}" style="font-size: 14px">

            <p:outputLabel value="Equipamento:"/>
            <p:selectOneMenu id="selecionadorEquipamento" value="#{cadastrosIPsBean.selectedCadastro.equipamento}" style="width: 92%">
                <f:selectItems value="#{cadastrosIPsBean.listaEquipamentosFormatada}"/>
            </p:selectOneMenu>

            <br/>
            <br/>

            <f:facet name="footer">

                <p:commandButton value="Save" id="btConfirmar" oncomplete="PF('dlgConfirmar').show()" update=":form:tbl" style="width: 125px">
                    <p:dialog appendTo="@(body)" header="Confirmar alterações" id="confirmar" widgetVar="dlgConfirmar" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
                        <br/>
                        <p:outputLabel value="Tem certeza de que deseja salvar as alterações?" style="font-size: 14px"/>
                        <br/>
                        <br/>
                        <f:facet name="footer">
                            <p:commandButton id="confirmarSim" value="Yes" process="tbl" oncomplete="PF('dlgConfirmar').hide(); PF('dlgEditar').hide()" actionListener="#{cadastrosIPsBean.salvarAlteracoes()}" update=":form:growlInformacao" style="font-size: 14px; width: 100px"/>
                            <p:spacer width="20"/>
                            <p:commandButton id="confirmarCancelar" value="Cancel" process="tbl" oncomplete="PF('dlgConfirmar').hide()" actionListener="#{cadastrosIPsBean.atualizaListasUltimosCadastros()}" update=":form:tbl" style="font-size: 14px; width: 100px"/>
                        </f:facet>
                    </p:dialog>
                </p:commandButton>

                <p:spacer width="20"/>

                <p:commandButton value="Close" id="btFechar" oncomplete="PF('dlgDescartar').show()" action="#{cadastrosIPsBean.atualizaListasUltimosCadastros()}" update=":form:tbl" style="width: 125px">
                    <p:dialog appendTo="@(body)" header="Descartar alterações" id="descartar" widgetVar="dlgDescartar" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
                        <br/>
                        <p:outputLabel value="Tem certeza de que deseja descartar as alterações?" style="font-size: 14px"/>
                        <br/>
                        <br/>
                        <f:facet name="footer">
                            <p:commandButton id="fecharSim" value="Sim" process="tbl" oncomplete="PF('dlgDescartar').hide(); PF('dlgEditar').hide()" action="#{cadastrosIPsBean.atualizaListasUltimosCadastros()}" update=":form:tbl" style="font-size: 14px; width: 100px"/>
                            <p:spacer width="20"/>
                            <p:commandButton id="fecharCancelar" value="Cancelar" process="tbl" oncomplete="PF('dlgDescartar').hide()" action="#{cadastrosIPsBean.atualizaListasUltimosCadastros()}" update=":form:tbl" style="font-size: 14px; width: 100px"/>
                        </f:facet>
                    </p:dialog>
                </p:commandButton>

            </f:facet>

        </p:panelGrid>

</p:dialog>

The rest of the code works well, it's just that button with id="confirmarSim" that does not call the backing bean method "#{cadastrosIPsBean.salvarAlteracoes()}".

Why this method is not called?

Guilherme Abacherli Guilherme Abacherli · Accepted Answer · 2018-04-05T11:02:15

You need to put the dialogs out of the main <h:form></h:form> and insert each of the dialogs into others forms.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html>
    <h:head>
    </h:head>

    <h:body>
            <h:form id="form">

            </h:form>

            <p:dialog appendTo="@(body)" header="Header" id="dialog1" widgetVar="dlg1" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
                <h:form id="firstDialog">
                    <br/>
                    <p:outputLabel value="Some text here?" style="font-size: 14px"/>
                    <br/>
                    <br/>
                    <p:separator/>
                    <div align="center" style="background-color: #DEDEDE">
                        <p:commandButton value="Yes" oncomplete="PF('dlg1').hide()" action="#{namedBean.method.execute()}" update=":form:growl, :form:dataList, :form:panelGrid" style="font-size: 14px; width: 100px"/>
                        <p:spacer width="20"/>
                        <p:commandButton value="Cancel" oncomplete="PF('dlg1').hide()" action="#{namedBean.method.execute()}" update=":form:growl" style="font-size: 14px; width: 100px"/>
                    </div>
                </h:form>
            </p:dialog>

            <p:dialog appendTo="@(body)" header="Header" id="dialog2" widgetVar="dlgExcluir" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
                <h:form id="secondDialog">
                    <br/>
                    <p:outputLabel value="Tem certeza de que deseja excluir o equipamento #{equipamentosBean.selectedEquipamento.nome}?" style="font-size: 14px"/>
                    <br/>
                    <br/>
                    <p:separator/>
                    <div align="center" style="background-color: #DEDEDE">
                        <p:commandButton value="Sim" oncomplete="PF('dlg2').hide()" action="#{namedBean.method.execute()}" update=":form:growl, :form:dataList, :form:panelGrid" style="font-size: 14px; width: 100px"/>
                        <p:spacer width="20"/>
                        <p:commandButton value="Cancelar" oncomplete="PF('dlg2').hide()" action="#{namedBean.method.execute()}" update=":form:growl" style="font-size: 14px; width: 100px"/>
                    </div>
                </h:form>
            </p:dialog>

            <p:dialog appendTo="@(body)" header="Header" id="dialog3" widgetVar="dlg3" modal="true" showEffect="fade" hideEffect="fade" resizable="false" draggable="false">
                <h:form id="thirdDialog">
                    <br/>
                    <p:outputLabel value="Some text here?" style="font-size: 14px"/>
                    <br/>
                    <br/>
                    <p:separator/>
                    <div align="center" style="background-color: #DEDEDE">
                        <p:commandButton value="Yes" oncomplete="PF('dlg3').hide()" action="#{namedBean.method.execute()}" update=":form:growl, :form:dataList, :form:panelGrid" style="font-size: 14px; width: 100px"/>
                        <p:spacer width="20"/>
                        <p:commandButton value="Cancel" oncomplete="PF('dlg3').hide()" action="#{namedBean.method.execute()}" update=":form:growl" style="font-size: 14px; width: 100px"/>
                    </div>
                </h:form>
            </p:dialog>

    </h:body>
</html>

Primefaces dialog over dialog method not called

1 Answers