Primefaces how to update content in a dialog and keep the dialog centered?
jsf, jsf-2, primefaces
Solution
The `onclick` is executed before the ajax request. You need to open the dialog in `oncomplete` instead. This will be executed after the ajax request and update. The `<p:dialog>` is namely by default hidden unless its `visible` attribute evaluates `true`.
<p:commandLink value="Read more" actionListener="#{content.getFullArticle}"
update=":dialog" oncomplete="dlg.show()">
Unrelated to the concrete problem, are you aware that you can pass fullworthy objects as method arguments since EL 2.2? This makes the `<f:attribute>` and `actionListener` "hack" superfluous:
<p:commandLink value="Read more" action="#{content.getFullArticle(news)}"
update=":dialog" oncomplete="dlg.show()" />
Problem
I have a dialog that contains no content on page load and I'm dynamically setting the content of a dialog box based on the link that a user clicks on. ``` <p:dialog widgetVar="dlg" modal="true" id="dialog"> <p:panel id="fullArticle"> <h:outputText value="#{content.newsArticle}" escape="false" /> </p:panel> </p:dialog> ... ... <p:commandLink value="Read more" actionListener="#{content.getFullArticle}" onclick='dlg.show();' update=":fullArticle"> <f:attribute name="contentId" value="#{news.contentId}" /> </p:commandLink> ``` The problem i'm having is that when you click the "Read More" link, it shows the dialog, but the dialog is not centered on the page. If i change the udpate attribute on the commandLink to `update=":dialog"`, the dialog flashes as if it's opening and then closing right away. How can I update the dialog and have it be centered with dynamic content?
Related problems
- Invoke direct methods or methods with arguments / variables / parameters in EL
- How to use <h:form> in JSF page? Single form? Multiple forms? Nested forms?
- How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"
- p:commandbutton action doesn't work inside p:dialog