Liquid UI - Documentation - 18.10 Open the Select File Dialog/Popup in Liquid UI

18.10 Open the Select File Dialog/Popup in Liquid UI


Prerequisites

Purpose

This document addresses the prevalent problem that users experience when attempting to upload invoices into an SAP system. This issue involves errors, such as primitive undefined or ActiveX Object class not registered, which occur when attempting to attach files through the File Dialog or Select File pop-up.

These errors have the potential to disrupt the file upload process and hinder overall productivity. To address this matter, we present a practical solution that circumvents the problematic pop-up by utilizing the native file selection dialog. Furthermore, this solution provides a seamless mechanism for attaching files, ensuring a smoother and more efficient interaction with the SAP system, based on the SAP Easy Access screen. The following actions will be performed:

  1. Delete the image container on the SAP Easy Access screen
  2. Add an input field to enter the user name
  3. Add a push button to execute the process
  4. Add a function to trigger the popup
  5. Load the external files

User Interface

//Create the file SAPLSMTR_NAVIGATION.E0100.sjs inside your scripts folder for customizing the SAP Easy Access screen
//Now, add the Liquid UI script to the above file and save it.

Customization

  1. Delete the image container on the SAP Easy Access screen using del().
     
    //Deletes the image container on the SAP screen
    del("X[IMAGE_CONTAINER]");
    
     
     
  2. Add a push button labeled Select File to execute the fileopenfunc process on click.
     
    //Creates a push button to execute the process
    pushbutton([3,4], "@49@Select File", "?",{ "process":fileopenfunc, "size":[2,26]});
    
     
     
  3. Add the fileopenfunc function to trigger the popup.
     
    //Function to trigger the popup
    function fileopenfunc(){
       var dialog = new system.CommonDialog();
       dialog.ShowOpen();
       var ret = dialog.FileName;
       dialog = void 0;
       if(hasValue(ret)){
          message("S: File Selected = ",ret);
       }
       else{
          message("E: File not selected");
       }
    }
    

    //Create the ESESSION.sjs file inside your script folder and save the below script.

  4. Load the external files FUNCTIONS_GENERIC.sjs and FUNCTIONS_SECURITY.sjs using load() and save it.
     
    //Loads the external files
    load("FUNCTIONS_GENERIC.sjs");
    load("FUNCTIONS_SECURITY.sjs"); 
    

SAP Process

  1. Refresh the SAP screen and click the Select File push button. Then, a file selection dialog will appear; select the desired file and click Open.
     
     
  2. Upon selecting a file, a confirmation message as File selected along with the corresponding file path will be displayed on the SAP system's status bar.
     
     
  3. If no file is selected, you will see an error message stating File not selected.
     
     

Can't find the answers you're looking for?