Purpose
Read data from an HTML viewer control

Certain SAP transactions embed an HTML control into the SAP GUI screen to display data. In an InputScript you can read these data into GuiXT variables.

We here describe two methods to read the data from the HTML control:

Method 1
Use connectHTML

Method 2
Use CallJS with suitable JavaScript functions

Method 1 has the advantage that it does not require JavaScript programming, but it is somewhat limited and may not be powerful enough for complex HTML pages.

Method  2 requires the GuiXT Controls component and is based on JavaScript and the "DOM" model of the HTML page. It has no limitations concerning the manipulation (reading, writing and event handling) of the HTML page.

We explain both methods using the SAP standard test program "SAPHTML_EVENTS_DEMO" that you can start with transacrtion SE38:



Method 1 connectHTML

When developing the HTML access in your InputScript, start with a tiny InputScript
 
 ConnectHTML -showNames
 Return

This adds a tooltip to all elements of the HTML page which are accessible via ConnectHTML:



Use the name shown in the tooltip for an "HTML variable" HTML[...]:

ConnectHTML
Message "&HTML[text_FirstName]" -ok
Return




You may also set a value into an HTML input field:

ConnectHTML
Set HTML[text_FirstName.2] "Mary"
Return





Method 2 CallJS

Write a JavaScript function that you call up with  CallJS (GuiXT Controls). In the JavaScript function you obtain the "HTMLDocument" object of the embedded HTML page with

var doc = guixt.GetControl("htmldocument");

For example, you can return the whole HTML string of the document body with the function

function GetHTMLSource()
{
   var doc = guixt.GetControl("htmldocument");
   return doc.body.innerHTML;
}

Sample InputScript:

CallJS source = GetHTMLSource
 Message "&V[source]" -ok
 Return

Result:



SImilarly, you can use the appropriate DOM access methods such as "getElementById()" or "getElementsByName()" to read or write values. Example:

function GetFirstName(n)
 {
   var doc = guixt.GetControl("htmldocument");
   return doc.getElementsByName("FirstName")(n-1).value;
 }

CallJS name1 = GetFirstname 1
CallJS name2 = GetFirstname 2
Message "Left: &V[name1] Right: &V[name2]" -ok
Return




Components
InputAssistant + Controls