Primefaces p:commandButton action not redirecting when in a p:dialog


I have a command button with an action that returns a new URL to redirect to. When this command button is not inside the p:dialog all works as I would expect, but when I put the command button in the dialog then the dialog just closes and leaves me on the same page.

<h:form id="reviewForm">
    <h:messages id="saveMsg" showDetail="true" globalOnly="true"/>
    <p:panel style="text-align: center">
        <p:commandButton type="button" value="Submit" onclick="showOptions();;" />
    <p:dialog id="areYouSure" widgetVar="areYouSureVar" resizable="false" width="400" modal="true" header="Are you sure you want to continue?">                                           
        <p:panel style="text-align: center">        
            <p:commandButton id="submit" ajax="false" value="Submit" action="#{mybean.myaction}" oncomplete="areYouSureVar.hide();"/>
            <p:commandButton type="button" value="Cancel" onclick="areYouSureVar.hide();"/>

mybean.action returns a string that points to another page, but that page never loads, the dialog goes away and that is all.

Best Solution

Untested but maybe this helps:

Checkout the primefaces documentation here (Version 3.3):

At page 150 it says:

Use appendToBody with care as the page definition and html dom would be different, for example if dialog is inside an h:form component and appendToBody is enabled, on the browser dialog would be outside of form and may cause unexpected results. In this case, nest a form inside a dialog.

Nesting the dialog into a form element looks a bit strange to me.

Related Question