This is another post about using JavaScript in ADF Faces, So again nothing complicated just simple things but needed often
In this post i am covering two simple requirements , using Jdeveloper 11.1.2.4 (11g Release2)
1. How to call button action (ActionEvent) using JavaScript
2. How to call valueChangeListener of a component using JavaScript
So for this just drop a commandButton and an inputText on page and create a ActionListener in managed bean for button
Code in managed bean for ActionEvent-
Now requirement is to call this button action on double click event of mouse in inputText
To handle ActionEvent in JavaScript, framework provides a class AdfActionEvent , it has a method to queue ActionEvent from a component. So here i use same method to call ActionEvent
See JavaScript function-
and call it using af:clientListener under af:inputText-
Run page and check on double click of mouse in inputText-
This is also same as pervious one, created a valueChangeListener in managed bean for input text and requirement is to call this listener on mouse hover of button
Code in managed bean for ValueChangeListener-
There is a class to handle valueChange event using JavaScript - AdfValueChangeEvent
So this class also has a queue method , the difference is this queue method takes 4 parameters and also requires a value change event on component
So first step is to change (set) value of field using JavaScript and then queue valueChangeEvent
See JavaScript function-
make sure that clientComponent and autoSubmit property of inputText set to true
call this javascript fucntion from button using af:clientListener
Run page and check it-
Thanks, Happy Learning
In this post i am covering two simple requirements , using Jdeveloper 11.1.2.4 (11g Release2)
1. How to call button action (ActionEvent) using JavaScript
2. How to call valueChangeListener of a component using JavaScript
Call button action using JavaScript-
So for this just drop a commandButton and an inputText on page and create a ActionListener in managed bean for button
Code in managed bean for ActionEvent-
/**Action Listener for Button * @param actionEvent */ public void buttonAction(ActionEvent actionEvent) { FacesMessage msg = new FacesMessage("Button Action called"); FacesContext context = FacesContext.getCurrentInstance(); context.addMessage(null, msg); }
Now requirement is to call this button action on double click event of mouse in inputText
To handle ActionEvent in JavaScript, framework provides a class AdfActionEvent , it has a method to queue ActionEvent from a component. So here i use same method to call ActionEvent
See JavaScript function-
function callButtonAction() { //Method to get component using id (here button is top container) var button = AdfPage.PAGE.findComponentByAbsoluteId('cb1'); //Method to queue ActionEvent from component AdfActionEvent.queue(button, button.getPartialSubmit()); }
and call it using af:clientListener under af:inputText-
Run page and check on double click of mouse in inputText-
Call ValueChangeListener using JavaScript-
This is also same as pervious one, created a valueChangeListener in managed bean for input text and requirement is to call this listener on mouse hover of button
Code in managed bean for ValueChangeListener-
/**ValueChangeListener for inputText * @param valueChangeEvent */ public void inputTextVCE(ValueChangeEvent valueChangeEvent) { FacesMessage msg = new FacesMessage("Value Change Lestener called"); FacesContext context = FacesContext.getCurrentInstance(); context.addMessage(null, msg); }
There is a class to handle valueChange event using JavaScript - AdfValueChangeEvent
So this class also has a queue method , the difference is this queue method takes 4 parameters and also requires a value change event on component
So first step is to change (set) value of field using JavaScript and then queue valueChangeEvent
See JavaScript function-
function callValueChangeEvent(evt) { //Method to get component using id (here inputText is top container) var field = AdfPage.PAGE.findComponentByAbsoluteId('it1'); //Change(set) field's value field.setValue('I am JavaScript text'); //Get New changed value var newVal = field.getValue(); //Queue ValueChangeEvent (component,oldValue,newValue,autoSubmit) AdfValueChangeEvent.queue(field, null, newVal, false); }
make sure that clientComponent and autoSubmit property of inputText set to true
call this javascript fucntion from button using af:clientListener
Run page and check it-
Thanks, Happy Learning