How to show a popup in primefaces with the requiredMessages, only if these messages exist?

Question

I want to show a popup with the requiredMessages of some inputText fields when I click on a submit button. But just only in case of there are those messages. I have tried with bean variable and javascript on the oncomplete tag, but I'm not able to make it work properly. If I put visible="true" in p:dialog, the popup is always displayed, although I try to control it from the commandButton. Now, I have this, but the popup is never displayed:

<h:inputText id="Scheme" 
            required="true"
            requiredMessage="Required.">
</h:inputText>

<h:commandButton id="submitModify" value="#{msg['systemdetail.modify']}"
             action="#{sistem.modify}"
             oncomplete="if (#{facesContext.maximumSeverity != null}) {dlg1.show();}">
</h:commandButton>

<p:dialog id="popup"
          style="text-align:center"
          widgetVar="dlg1"
          modal="true">  
    <h:messages layout="table"/>
</p:dialog> 

How can I do this? Thanks in advance.

Answer 1

Standard JSF and PrimeFaces does not support request based EL evaluation in on* attributes. RichFaces is the only who supports that. Besides, the standard JSF <h:commandButton> does not have an oncomplete attribute at all. You're probably confusing with PrimeFaces <p:commandButton>

There are several ways to achieve this:

• Check the condition in the visible attribute of the <p:dialog> instead.

   <p:dialog visible="#{not empty facesContext.messageList}"> 

  or if you want to show validation messages only instead of all messages

   <p:dialog visible="#{facesContext.validationFailed}"> 

  ---

• Use PrimeFaces <p:commandButton> instead, the PrimeFaces JS API supports the #{facesContext.validationFailed} condition through the args object as well:

   <p:commandButton ... oncomplete="if (args.validationFailed) dlg1.show()" /> 

Answer 2

If you need to check for what kind of messages, here is a way that I made work with primefaces. Since primefaces oncomplete is called after update, by updating the component holding the javascript function, the javascript function can be rebuilt using the latest #facesContext.maximumSeverity} values before executed.

<p:commandButton
    oncomplete="executeAfterUpdate()"
    update="updatedBeforeOnComplete"/>

<h:panelGroup id="updatedBeforeOnComplete">
    <script language="JavaScript" type="text/javascript">
        //
        function executeAfterUpdate(){
            if (#{facesContext.maximumSeverity==null
               or facesContext.maximumSeverity.ordinal=='1'})
            {
                // your code to execute here
                someDialog.show();
            }
        }
        //
    </script>
</h:panelGroup>