Tuesday, April 18, 2023

Oracle ADF caputure enter via javascript

 To capture enter key via javascript on an ADF input text do that:

       <af:panelGroupLayout id="pgl1">  
         <af:inputText label="Label 1" id="it1" clientComponent="true" autoSubmit="true">  
           <af:clientListener method="onInputTextKeyUp" type="keyUp"/>  
         </af:inputText>  
         <af:button text="button" id="b1" unsecure="disabled" disabled="true" clientComponent="true"  
               actionListener="#{myDemoRequestBean.onActionListener}"/>  
       </af:panelGroupLayout>  
 <af:resource type="javascript">  
         function onInputTextKeyUp(event){  
       //console.log("onInputTextKeyUp");  
       var component = event.getSource();  
        if(component != null){  
         var _keyCode = event.getKeyCode();  
         if(_keyCode==='Enter' || _keyCode ===13 ){  
           console.log("enter "+_keyCode);  
         }  
        }  
     }  
     </af:resource>  

Capturing enter you can do anything you want, for example associate a serverListener to execute code and simulate button click


       <af:panelGroupLayout id="pgl1">  
         <af:inputText label="Label 1" id="it1" clientComponent="true" autoSubmit="true"  
                valueChangeListener="#{myDemoRequestBean.onInputTextValueChange}">  
           <af:clientListener method="onInputTextKeyUp" type="keyUp"/>  
           <af:serverListener type="buttonClick" method="#{myDemoRequestBean.onServerListenerButtonClick}"/>  
         </af:inputText>  
         <af:button text="button" id="b1" unsecure="disabled" disabled="true" clientComponent="true"  
               actionListener="#{myDemoRequestBean.onActionListener}"/>  
       </af:panelGroupLayout>  
 ...........  
 <af:resource type="javascript">  
  function onInputTextKeyUp(event){  
       //console.log("onInputTextKeyUp");  
       var component = event.getSource();  
        if(component != null){  
         var _keyCode = event.getKeyCode();  
         if(_keyCode==='Enter' || _keyCode ===13 ){  
           //console.log("enter "+_keyCode);  
           AdfCustomEvent.queue(event.getSource(), "buttonClick",  
             null, true);  
         }  
        }  
     }  
     </af:resource>  

follow request bean java code:

 import javax.faces.event.ActionEvent;  
 import javax.faces.event.ValueChangeEvent;  
 import oracle.adf.view.rich.render.ClientEvent;  
 public class MyDemoRequestBean {  
   public MyDemoRequestBean() {  
   }  
   public void onActionListener(ActionEvent actionEvent) {  
     myMethod();  
   }  
   public void onServerListenerButtonClick(ClientEvent clientEvent) {  
     myMethod();  
   }  
   private void myMethod(){  
     System.out.println("my button code");  
   }  
   public void onInputTextValueChange(ValueChangeEvent valueChangeEvent) {  
     System.out.println(valueChangeEvent.getNewValue());  
   }  
 }  



No comments:

Post a Comment