A surface surface graphic is displayed only once

Question

I have a form with a button that opens a Primafaces overlayPanel . There is another button on the panel that performs an Ajax action and then closes the overlay.
Here is a simplified version without Ajax action:

 <h:form> <p:commandButton id="button1" value="Open overlay" type="button"/> <p:overlayPanel for="button1" widgetVar="ovl" dynamic="true"> <p:commandButton value="Close" oncomplete="ovl.hide();" update="@form"/> </p:overlayPanel> </h:form> 

Please note that the panel must have dynamic="true" , because dynamic content must be selected in the real application, and update="@form" necessary to update other components of the form.

Problem: if I have both attributes, dynamic="true" and update="@form" , the overlay only appears for the first time. After clicking the “close” button, if I try to click “open overlay” again, the panel will not appear.

What am I doing wrong?

(Using PrimeFaces 3.5 and GlassFish 3.1.2.2)

Answer 1

Use onclick="widgetVar.loadContents()" in the button, discarding the overlaypanel , where widgetVar is the var overlaypanel .

Answer 2

What I noticed with the code below, as soon as you update the form containing the Open-Overlay button, it breaks.

 <h:form> <p:commandButton id="button1" value="Open overlay" type="button"/> <p:commandButton value="break things" update="@form" /> <p:overlayPanel for="button1" dynamic="true"> <p:commandButton value="Close" update="@form" /> </p:overlayPanel> </h:form> 

If you can split the form into two, the button built into the OverlayPanel may try to trigger a click on the button used to switch the overlay. Perhaps something is in line with below.

 <h:form> <p:commandButton id="button1" value="Open overlay" type="button"/> <p:overlayPanel for="button1" dynamic="true" > <p:commandButton value="Close" update=":formToBeUpdated" onclick="document.getElementById('button1').click();"/> </p:overlayPanel> </h:form> <h:form id="formToBeUpdated"> <h:inputText value="bleh"/> </h:form> 

Answer 3

You must give your overlayPanel identifier and oncompelete your button to show it. The code is as follows:

 <h:form> <p:commandButton id="button1" value="Open overlay" type="button" oncomplete="PF('ovlID').show()"/> <p:overlayPanel id="ovlID" for="button1" widgetVar="ovl" dynamic="true"> <p:commandButton value="Close" oncomplete="ovl.hide();" update="@form"/> </p:overlayPanel> </h:form>