The dialog, when used with an appendToBody/appendTo="@Body" must have its own form.
<p:dialog>
<h:form>
...
</h:form>
</p:dialog>
Because, when the dialog is generated into HTML output, it’s by JavaScript relocated to the end of HTML <body> which causes it to not be sitting in any form anymore. The generated HTML DOM tree ends up to look like this (use webbrowser’s dev tools to see it):
<body>
...
<form id="createAppUserForm">
...
</form>
...
<div id="newRoleDialogId" class="ui-dialog ...">
...
</div>
</body>
The appendToBody="true" plays a role in here. The end of body ensures easy and best cross browser compatibility of displaying a modal dialog by JavaScript.
The same is true by the way for a p:overlayPanel with an appendTo...
But also make sure there is, before ‘moving’ the p:dialog, there is not a nested h:form. So prevent
<h:form>
...
<p:dialog>
<h:form>
...
</h:form>
</p:dialog>
...
</h:form>
Since although it ends up like
<body>
...
<form id="createAppUserForm">
...
</form>
...
<div id="newRoleDialogId" class="ui-dialog ...">
<form>
...
</form>
</div>
</body>
it is initially invalid html