jsf - <p:dialog appendToBody="true" doesn't call Converter class

Question

I am using Primefaces 3.4.2 with JSF 2.0

I have the following in a dialog popup in JSF page.

<p:dialog header="Create New Request" style="font-weight:bold"
        widgetVar="newDialog" resizable="false" id="newDlg"
        showEffect="fade" hideEffect="fade" appendToBody="true"
        modal="true" position="center top" width="850" height="450">
        <p:panelGrid columns="2">
        <h:outputLabel value="Employee" for="employee" />
            <p:selectOneMenu id="employee" value="#{mymb.employee}" 
            converter="#{employeeConverter}">
         <f:selectItems value="#{mymb.employeeItems}" var="emp"
        itemLabel="#{emp.employeeName}" itemValue="#{emp.employeeNumber}"/>
       <p:ajax listener="#{mymb.loadDepartments}"  process="@this"/>
</p:selectOneMenu>

        </p:panelGrid>
        <p:separator />
            </p:dialog>

If I use appendToBody="true", then selectOneMenu Converter class doesn't gets invoked, but if I make it appendToBody="false", then Converter class gets invoked.

What could be the reason for this? appendToBody="false" makes my popup dialog unusable, not able to navigate using mouse.

How can I resolve this issue?

Answer 1

Remove the appendToBody and put an <h:form/> inside your dialog(along with it's content).

The purpose of appendToBody="false" is to ensure your dialog is rendered within the body (and hence within the main <h:form/>) of the HTML output.

Without appendToBody="false" , the dialog might end up being appended to the end of the markup in <body/> and as a result, nothing inside it will get executed.

Adding <h:form/> to your dialog ensures that even if it winds up outside the <body/> it will still be able to submit to the server