7.08 htmlnode()

Purpose

With htmlnode(), you can read or display HTML on SAP screens.

htmlnode() can be very useful when users want to view images or to implement a Google map in web server.

Syntax

htmlnode('101', [row,col], "html string");

Note: This command is very similar to the view command. However, the htmlnode command produces read-only results, while the view command can produce user-editable files and forms.

Options

The htmlnode() command does not take any options.

Viewing Google maps

To view a Google map in SAP:

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,"");
   } 

3. This function uses regular expressions to strip spaces from any strings.
4. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, create variables to store the values in the SAP fields:

   var street;
   var district;
   var city;
   var state;
   var country;
   var zipcode;
   var customer; 

5. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, use the set() command to copy the values from the SAP fields to the Liquid UI variables, we created in the previous step:

   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]"); 

6. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, generate the iFrame that will go into the htmlnode:

   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> 

7. In the 'SAPLSMTR_NAVIGATION.E0100.sjs' script file, enter the command:

   htmlnode(200, [5,85], [50,140], z_sold_to_address); 

8. Save the changes and refresh the SAP screen.
9. The screen appears as shown:
   

View image using htmlnode()

To view an image in SAP with htmlnode, please do the following.

Usage Details

• Web Server Commands