JSF: Dynamic include page into primefaces dialog - jsf

Question

I want to include the content of a primefaces dialog from another page with ui:include. The included page must be set dynamic depending on which button user clicked. I used the very helpful answer from BalusC from JSF dynamic include using Ajax request.
It works very fine as in the example. But problems come if I use a p:dialog instead of h:panelGroup:
<h:form>
<f:ajax render=":dialog">
<p:commandButton value="page1" action="#{productBean.setDialogPage('/page1.xhtml')}" oncomplete="dialogWidget.show()"></p:commandButton>
<p:commandButton value="page2" action="#{productBean.setDialogPage('/page2.xhtml')}" oncomplete="dialogWidget.show()"></p:commandButton>
</f:ajax>
</h:form>
<p:dialog id="dialog" widgetVar="dialogWidget" >
<ui:include src="#{productBean.dialogPage}" />
</p:dialog>
1st problem: Sometimes, I have to click a button several times before dialog appears. It seems not to follow any pattern but is a random effect. Sometimes I need to click twice, sometimes I need to click four times on the button.
2nd problem: Sometimes, the dialog appears not with the selected page but with the old one. When I close dialog and select again, the current page is loaded. It seems to be a random effect, too.
Why do I get this problems with dialog?

Answer 1

hy,
i don't know why you are using this mode to display dynamique dialog,
for me, i like use this mode:
<h:form>
<p:commandButton value="page1"
actionListener="#{productBean.setDialogPage('page1')}" oncomplete="PF('dialogWidget').show()" update="dialog"/>
<p:commandButton value="page2"
actionListener="#{productBean.setDialogPage('page2')}" oncomplete="PF('dialogWidget').show()" update="dialog"/>
</h:form>
<p:dialog id="dialog" widgetVar="dialogWidget">
<ui:include src="/#{productBean.dialogPage}.xhtml" />
</p:dialog>
and:
page1.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:form>
<!-- your code -->
</h:form>
</ui:composition>
it's working fine :)

Answer 2

If you reverse engineer existing tables with Netbeans 8 (generate entities + generate jsf pages), it will do something very similar out of the box; on the list page there is a create-button, which shows a dialog included from another page. You should try it, be sure to select "primefaces" in the last page in the guide for generating jsf pages. They do it like this:
List.xhtml:
<p:commandButton id="createButton" icon="ui-icon-plus" value="#{bundle.Create}" actionListener="#{kornstoranalyseStdController.prepareCreate}" update=":KornstoranalyseStdCreateForm" oncomplete="PF('KornstoranalyseStdCreateDialog').show()" />
Create.xhtml is included with <ui:include src="Create.xhtml"/> below </h:form> in the list-page.
Create.xhtml starts with:
<ui:composition>
<p:dialog id="KornstoranalyseStdCreateDlg" width="500px" widgetVar="KornstoranalyseStdCreateDialog" modal="true" resizable="true" showEffect="clip" appendTo="#(body)" header="#{bundle.CreateKornstoranalyseStdTitle}" hideEffect="clip" position="top">
<h:form id="KornstoranalyseStdCreateForm">
Hopefully you can tweak to suit your needs.