Embedding HTML: Embed an HTML menu

Solution
- Implement the menu as HTML page
- Embed the HTML page into the SAP GUI window with "Control"
- Use connectHTML and JavaScript to call up an InputScript from HTML

When the user clicks on one of the images, we call an InputScript and pass the selected city as parameter. The InputScript can now perform arbitrary actions, such as executing a transaction. For the example we only show the selected city:

// parameter passed from HTML page
Parameter DEST

// display a test message
Message "&U[DEST]" -statusline

// return
Return

del X[IMAGE_CONTAINER]

Control (1,1) (12.5,97.6) progid="file://menu100.html" name="mymenu"

connectHTML name="mymenu"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="en" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />

<script type="text/javascript">

// GuiXT object
var guixt;
 
// called by connectHTML, passes GuiXT object
function guixt_initialize(obj)
{
  guixt = obj;
};


function select(destination)
{

 // start InputScript "myscript.txt"
 // pass selected destination as parameter DEST
 guixt.Input("U[DEST]:" + destination + ";OK:/0,process=myscript.txt");

};
</script>


</head>

<body style="margin: 10px; background-color: white">

<span style="font-family: Verdana; font-size: 36px; color: #808080">
Please select your destination:</span><br />

<img style="height:180px; margin-right:10px; cursor:pointer;"  
   src="rome.png"  
   alt="Rome" title="Destination Rome"
   onclick="select('Rome');"/>

<img style="height:180px; margin-right:10px; cursor:pointer;" 
   src="london.png" 
  alt="London" title="Destination London"  
  onclick="select('London');"/> 

</body>

</html>