1 Reply Latest reply on Feb 22, 2016 10:19 AM by michpetrov

    enter key closes rich:popupPanel depsite oncomplete logic

    arnieaustin

      I've built a rich:popupPanel that is a data entry dialog and works as intended but for two small issues:

       

      1) the status doesn't appear (it does elsewhere).

      2) the Enter key with the focus in any field closes the modal WITHOUT calling the actionListener.

       

      <a4j:commandButton id="cmdUpdateModalTrainingAddressEdit" status="statusInProgress"
          value="#{messages.getString('application.lbl.cmdSave')}"
          actionListener="#{infoTrainingLocationAddressEdit.saveOrUpdateListener}"
          execute="@form" render="infoTrainingLocationEditTabAddressOutputPanel" 
          data="#{infoTrainingLocationAddressEdit.okToClose}"
          onclick="return false;"
          oncomplete="if (event.data === true) { #{rich:component('modalInfoTrainingLocationAddressEdit')}.hide(); } else { return false; }"  
          rendered="#{not infoTrainingLocationAddressDTOEdit.readOnly}">
          <f:param name="cid"
              value="#{javax.enterprise.context.conversation.id}" />
      </a4j:commandButton>
      <rich:hotKey key="enter" enabledInInput="true"  
          onkeydown="${rich:component('cmdUpdateModalTrainingAddressEdit')}.click();return false;" />
      
      
      

       

      When the button is pressed via a mouse click, everything works: the listener is called and if there are errors, the modal doesn't close.

       

      So what does it take in RF 4 to have the dialog NOT close w/o doing a thing?

       

      One would have thought that the onclick="return false;" would have been sufficient, but it isn't.

        • 1. Re: enter key closes rich:popupPanel depsite oncomplete logic
          michpetrov
          1. Does the status have a high enough z-index? It may be hidden under the popup.
          2. the key name should be "return", whatever you're seeing is the default browser response to pressing Enter; you should also use @selector, otherwise the hotkey is attached to document and the event doesn't reach it

           

          It also pays to do a dry run on the JavaScript before you put it on a component, you'd find that it doesn't work

          • a4j:commandButton doesn't have a backing object so rich:component returns nothing, you need rich:element
          • onclick="return false" prevents the form submission