Thursday, October 7, 2021

Oracle ADF-Calling Java Script/java method on page load of .jspx/.jsf

Requirement-In ADF application we often come across requirement where we want to call JavaScript method or java Method on page load or after load o  of .JSPX or .JSF page.


Solution:

First step is to add clientListener onBodyLoad method which gets called on load of page as below

    <af:clientListener method="onBodyLoad" type="load"></af:clientListener>





Java script method as below















Above you can notice I am firing the click event by finding component “main” which is panel group layout as below.

Since there is af:clientListener added inside af:panelGroupLayout onMainClick method  get called.























onMainClick javascript function i am getting OS type of client and passing it to serverListener which is getting called by queueing the event as below





In the bean method of server Listener I am just reading the OS type that is passed and putting it in sessionScope and then refresh output text to show the OS type on UI as below


    public void onTemplateLoad(ClientEvent clientEvent) {

           // Add event code here...

           String osType = (String) clientEvent.getParameters().get("osType");

          

           System.out.println("Os type-"+osType);

       

           ADFContext.getCurrent().getSessionScope().put("OSTYPE", osType);

           AdfFacesContext.getCurrentInstance().addPartialTarget(panelGroupBinding);

 

       }

When you run page it shows first the alert as below




















And then shows OS type as below



Sunday, October 3, 2021

Showing popup while switching ADF Panel tab

Requirement-

In ADF when we use adf panel tab component we often come across requirement where when user switches tabs we want to show user popup saying “Do you really want to switch Tabs? Any uncommitted changes will be lost”. In case user say No we want to keep user on the same tab. 

Solution –

My panel tab jsf/jspx code is as below 



 





Here as highlighted above you can notice that I have java script method which is getting called on disclosure event of af:showDetailItem. 

Java Script code is as below.



























  1. First declare two java script variable that are global on page one for tab to close and one for tab to open
  2. Using disclosure event initialize the two global variables (theTabToClose, theTabToOpen)and then cancel the disclosure event as we want to show popup to user which will ask for confirmation.
  3. using popup.show(); show popup to user asking for confirmation.Popup code is as below 













  1. In Popup that opens there would be two buttons Ok/Cancel. On each button click call handlePopupOkCancel java script method and pass action(Ok/Cancel) as parameter to javascript method using af:clientAttribute .
  2. In handlePopupOkCancel in case action is Ok then we close the tab using javascript as below .After this cancel button event and hide popup.

if (butPressed == 'OK') {

                  theTabToClose.setDisclosed(true);

              }

Final result when user switches tab –Here if you click cancel then tab is not switched and if you click ok tab will be switched.Please note the database rollback code you can write in disclosureListener of af:showDetailItem which would be java method in backing bean.