Purpose With connectHTML you can read values from an HTML page that you have displayed with the Control or Webview command. You can also change values and perform various actions, such as clicking on a link. Both your own HTML pages and any internet or intranet pages can be used. The display via  Control/WebView can be integrated into the SAP screen or can be a separate "floating" window.
Example connectHTML click="button_Continue"

The button "Continue" is clicked in the HTML page that is currently displayed via  COntrol or WebView.

Format
  • connectHTML options name="myname"
    Use the same name as specified in the statement
    Control / WebView .... name="myname"

After connectHTML you can use  HTML variables:

  • Set html[name] "value"          // Sets a value into the HTML page
  • "... &html[name] ..."           // reads a value from the HTML page        
  • if html[name]                   // queries the existence of an HTML element        

 

Options
name= Specification of the control name set by Control .... name= or WebView .... name= 
 
click= You name the HTML element (e.g. a button, an image or a link) that is to be clicked. Example:

connectHTML click="image_search.jpg"

geturl= This returns the current URL of the HTML page.  You can use it if you want to be sure that the user has not left the page. Example:

connectHTML geturl="url"
if not Q[ok] or not V[url=http:// ... /basket.asp]
   Return "E: Please display the 'shopping basket' first" -statusline
endif

seturl= Displays the HTML page with the given URL
gettitle= Returns the page title.
settitle= Sets a new page title. Since  View does not display the page title, this is for internal use only where you want to read the page title later on.
 

listelements=

All HTML elements of the current page are shown in the given text variable (long text). This is useful during script development, since you can then copy&paste the HTML element names from the text window. Example:

// GuiXT Script
Pushbutton (toolbar)
"Read HTML elements" process="get_html_elements.txt"
Textbox
(10,0) (40,120) name="elm"

// InputScript "get_html_elements.txt"
connectHTML
listelements="elm"

-shownames To be used during script development: The name of each HTML element is displayed as "tooltip" in the HTML page, provided the mouse points to this element for a few seconds.
-pressEnter Pressing the Enter key is simulated to trigger an action defined in the HTML pages by <form action=...>
-closeWindow The display window is closed.
Options for WebView only
run= Name of a text variable that contains JavaScript code. The specified code is executed in the global context of the web page.
runresult= Name of a text variable in which the result of the execution of run= is placed.
setHTMLfromText= Name of a text variable that contains HTML code. The code replaces the currently displayed content.
visible= Possible values are "on" and "off". The display of the web page is shown or hidden.
item= In conjunction with toText= and fromText=. The functionality is similar to that described below for html[...], but works with text variables. For example, a long text can be transferred to a text box of the HTML page.
checkItem= Checks whether an element with the specified name exists in the HTML page.
toText= Name of a text variable. The content of the element named with item= is placed in the text variable.
fromText= Name of a text variable. The content of the text variable is placed in the element named with item=.
capturePreview= Creates a screenshot of the current WebView in the specified file (PNG format).
callDevTools= Allows all methods of the Chrome DevTools protocol to be called (https://chromedevtools.github.io/devtools-protocol).
jsonInput= Name of a text variable containing the input parameters for callDevTools= in JSON format..
jsonOutput= Name of a text variable into which the output of callDevTools= is placed in JSON format.
zoomfactor= Dynamic specification of the display size, which can also be set statically in WebView.
Using the HTML elements The  HTML variables can be used in the same way as the usual script variables V[...]. Notation is html[...]. You can use it in following contexts:
  • Set html[name] "value"          // Sets a value into the HTML page
  • "... &html[name] ..."           // reads a value from the HTML page        
  • if html[name]                   // queries the existence of an HTML element        

After a new value is set, GuiXT automatically invokes the "on change" routine of the HTML page for this element. In the case of drop down fields (Select element) it is necessary in some cases to perform a click on this element after changing it, using  click=. Otherwise some of the internal processing in the HTML page might be missing.

When you automate the user interaction for an HTML page, the means provided by connectHTML are sufficient in most cases (setting values and clicking on links, buttons or images). However, in other cases, where special JavaScript or VBScript functions are used or there are special plugins in the page, the automation of the user interaction can be beyond the connectHTML capabilities.

How to name the HTML elements During development we suggest you use the listelements= and -shownames features to display the HTML element names.

GuiXT builds the name of an element in the following way: The name always starts with the element type  (image_, button_, checkbox_, ...). Next,  the internal id or name of the element, or user text (like a button text). All "space" characters are replaced with underline. If duplicate names arise, GuiXT adds a suffix .2, .3,... . Examples:

html[image_help.jpg]
html[link_Search]
html[link_Search.2]
html[select_Country]
html[text_Search_Filter]

HTML Tables Tables are quite common in HTML pages. They can be nested. GuiXT allows us to address each table cell. For the names, GuiXT uses the following notation: cell_i.j.k is  cell number  k of row j in table i.

For example,

html[cell_1.4.5]

denotes a cell within the first table of the page, namely the cell in row 4, column 5 (starting with 1).

For nested tables,  the name starts with the name of the cell that contains the table, followed by '~'  and the normal cell coordinates within the nested table. Example:

html[cell_3_1_7~1_2_2~2.2.4]

This is the following cell: Start with the third outer table of the page. Choose the cell in row 1, column 7. There is at least one nested table in this cell. Take the first one, and then the cell in row 2, column 2 of this first nested table. In this cell, there are at least 2 more nested tables (nesting level 2). Take the second one, go to row 2 and column 4, and you have reached cell cell_3_1_7~1_2_2~2.2.4.

Row count for each table

For each table GuiXT allocates an HTML variable  "..._rows" that contains the number of rows for this table. For example,

"&html[table_1_rows]"

denotes the number of rows of the first table. For nested table, the same rules as described above apply. Example:

"&html[table_3_1_7~1_rows]"

This is the number of rows of the first nested table contained in cell row 1 column 7 of the third table on the page.

Instead of using the row count, it is often more practical to query the existence of a certain cell. Example:

// row index
Set V[i] 1
  

label
begin

// no further row?
if not html[
cell_1.&V[i].1]
  goto
end
endif

... process table row

Set V[i] &V[i] +
1
goto
begin

label
end

Checkbox and radiobutton The values of a checkbox or radiobutton are represented by  0 and 1.  When you set a radiobutton all other radiobuttons in the same group are automatically reset. Example:


Set
html[radio_English] 1

Object "guixt" If a global JavaScript function "guixt_initialize" exists in the HTML page, it is called with the first connectHTML statement and the "guixt" object is passed, with which communication between GuiXT and JavaScript functions is possible. Details can be found in Object "guixt" in VBScript and JavaScript.
Components GuiXT + Controls