JSF 2.1 Tip of the Day: PrimeFaces Dialog <p:dialog/>

We have been doing a lot of work lately with PrimeFaces. A common set of questions comes up about displaying <p:dialog/> boxes on a page.

1. How do I update elements on the page outside of the dialog?
2. How do I include information from external pages?
3. Can I nest forms and dialogs?

The last one is the easiest to answer: NO. You may get away with it in some cases, but the HTML specification does not allow <form> tags to be nested inside other forms. So your dialog can contain a form, but should be outside of the form that opens it.

Some components do not need to live inside a <form> to work. For example <h:button /> tags do not need to be inside a <form>. You can update <h:outputText /> elements outside a <form> with AJAX.

The second question is also easy. Using <ui:include /> you may add other JSF content to your dialog. You could also use a <ui:decorate />, <ui:component />, <ui:define />, or <ui:composition />. I personally like <ui:include />

The first question is best answered with some code. I have some interesting tidbits of code in here including using String concatenation in Expression Language (EL). The key to updating elements on the page comes from the update attribute on the <p:commandButton /> elements.

The project and code I have included below were developed using NetBeans 7.2 IDE on GlassFish 3.1.2.2, and PrimeFaces 3.3.1.

The code can be downloaded here: primefaces-dialog-examples.zip

---

IndexBean.java

---