Liquid UI - Documentation - htmlnode-Viewing Google maps with htmlnode

htmlnode-Viewing Google maps with htmlnode


To view a Google map in SAP with htmlnode, please do the following.

  1. Go to the Easy Access screen in SAP.
  2. Open the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, and enter the following code to create a prototype string function. Create the file if it does not already exist.
    string.prototype.trim = function ( ) {
      return this.replace(/^\s+|\s+$/g,"");
    } 

    This function uses regular expressions to strip spaces from any strings.

  3. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, create variables to store the values in the SAP fields. An example is shown below:
    var street;
    var district;
    var city;
    var state;
    var country;
    var zipcode;
    var customer; 
  4. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, use the set command to copy the values from the SAP fields to the GuiXT variables we created in the previous step. An example is shown below:
    set("V[street]", "&F[Street/House Number]");
    set("V[customer]", "&F[Customer.text]");
    set("V[district]", "&F[District]");
    set("V[city]", "&F[ADDR1_DATA-CITY1]");
    set("V[state]", "&F[ARRD_DATA-REGION]");
    set("V[country]", "&F[ADDR1_DATA-COUNTRY]");
    set("V[zipcode]", "&F[ADDR1_DATA-POST_CODE1]"); 
  5. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, generate the iFrame that will go into the HTML node. An example is shown below:
    var z_sold_to_address = "<iframe scrolling=no width=100% 
    height=360 frameborder=0 src=\"http://www.agawarehouse.com/tools/map/?address="
    +encodeURIComponent(street.trim( ))+"%20"+encodeURIComponent(district.trim( ))
    + "%20"+encodeURIComponent(city.trim( ))+ "%20"+encodeURIComponent(state.trim( ))
    + "%20"+encodeURIComponent(state.trim( ))+ "%20"+encodeURIComponent(country.trim( ))
    + "%20"+encodeURIComponent(zipcode.trim( ))+"\"></iframe> 
  6. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, create the htmlnode. An example is shown below:
    htmlnode(200, [5,85], [50,140], z_sold_to_address); 
  7. Save the changes and refresh the SAP screen. It will now display as shown below:


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