Follow by Email

Tuesday, 7 June 2016

Open af:inputListOfValues popup by calling JavaScript programmatically


af:inputListOfValues provides option to open Lov values in a popup and allow user to search, We can open this popup by clicking on magnifying glass icon


Recently I have seen a thread on OTN forum where user wants to open lov popup on a button click after checking some conditions and also found a post by Frank Nimphius Where he used javascript to open Lov popup on double click of mouse.
So guess what I have done ? ;)
Just called that javascript fucntion programmatically on button click


  • Created Lov on Department Name attribute of Departments viewObect and dropped on page 


  • Dropped a button on page to open Lov popup


  • See button code in Managed Bean, Here I am calling a javascript code this code finds lov component using it's ID and then queue LaunchPopupEvent. 

  • import javax.faces.context.FacesContext;
    import javax.faces.event.ActionEvent;
    
    import org.apache.myfaces.trinidad.render.ExtendedRenderKitService;
    import org.apache.myfaces.trinidad.util.Service;
    
    
        /**Helper Method to call Javascript
         * @param javascriptCode
         */
        public static void writeJavaScriptToClient(String javascriptCode) {
            FacesContext facesCtx = FacesContext.getCurrentInstance();
            ExtendedRenderKitService service = Service.getRenderKitService(facesCtx, ExtendedRenderKitService.class);
            service.addScript(facesCtx, javascriptCode);
        }
    
        /**Method to open Lov popup programmatically
         * @param actionEvent
         */
        public void openLovPopupUsingJS(ActionEvent actionEvent) {
            StringBuilder sb = new StringBuilder();
            //Here deartmentNameId is ID attribute of InputLov
            sb.append("var lovComp =AdfPage.PAGE.findComponent('departmentNameId');");
            sb.append("\n if (lovComp instanceof AdfRichInputListOfValues && lovComp.getReadOnly() == false) {\n" +
                      "  AdfLaunchPopupEvent.queue(lovComp, true);}");
            writeJavaScriptToClient(sb.toString());
        }
    

  • Run and check application, click on button
All Done :)
Sample ADF Application (Jdev 12.1.3)- Download
Cheers :) Happy Learning

No comments :

Post a Comment