How to call managed bean method on ESC button?

Question

I want to execute a method from my managed bean when I press the ESC key from the keyboard. I have read some other posts but none of them is working on my application. Maybe I am not placing the script on the right position within the page.. I putted it above dhe af:document (it is an ADF application), also within the af:document. This is the JS code:

<af:resource type="javascript">
      $(document).keyup(function (e) {
          if (e.which == 27) {
              document.getElementById('cb3').click();
          }
      });
    </af:resource>

"cb3" is the ID of a button on my page that calls the method from my bean. I do not know another way to call the method directly. Any idea?

Answer 1

I thank @Gawish for the response as it helped me to find the solution. I couldn't use that solution because there is no type:"keyPress" in clientListener in ADF 11g. However I did like this and it works very well:

window.onkeyup = function (e) {
          if (e.keyCode == 27) {
              var button = AdfPage.PAGE.findComponentByAbsoluteId('cb3');
              AdfActionEvent.queue(button, true);
              e.cancel();
          }
      }

Pay attention, e.cancel() at the end is mandatory!

Answer 2

You should have something like this

<af:document title="Press ESC to do some action" id="d1">
  <f:facet name="metaContainer">
    <af:resource type="javascript">
       function onKeyPress(evt){
         var _keyCode = evt.getKeyCode();
         if (_keyCode == AdfKeyStroke.ESC_KEY ){    
              var button = AdfPage.PAGE.findComponentByAbsoluteId('cb1');
              AdfActionEvent.queue(button,true);
              evt.cancel();
         }
     }
    </af:resource>
   </f:facet>
   <af:commandButton text="Execute when ESC key is pressed" clientComponent="true" id="cb1" actionListener="#{someScope.someFunction}" />
   <af:clientListener method="onKeyPress" type="keyPress"/>
 </af:document>

This will create a client listener for the document which shall execute on any Key Press, and it listen to ESC key and if it found it execute whatever the Button executes!

Answer 3

There is another solution: add <af:clientListener method="handleESCaction" type="popupCanceled"/>

in your adf component but make sure clientComponent=true shall be added in component.