HTML pages generated from 3270 data streams

For applications that do not use BMS, CICS® Web support generates an HTML page which is in three parts: a heading section, a screen image section, and a footing section.

Attention: This topic contains Product-sensitive Programming Interface and Associated Guidance Information.

The heading section

CICS Web support generates the following heading section:
<!doctype html public "-//W3C//DTD HTML 3.2//EN">
<html>
<STYLE TYPE="text/css"> 
<!--                    
    TABLE, TR, TD       
    { padding: 0mm    } 
    TABLE               
    { width: 60%    }   
-->
.BRIGHT
{font-weight: bold}
{font-family: courier}
.INPUT
{font-family: courier}
</STYLE>
<head>
<title>CICS Web support screen emulation - tranid</title>
<meta name="generator" content="CICS Transaction Server/2.2.0">
<script language="JavaScript">
<!--
 function dfhsetcursor(n)
  {for (var i=0;i<document.form3270.elements.length;i++)  
     {if (document.form3270.elements[i].name == n)        
         {document.form3270.elements[i].focus();          
          document.form3270.DFH_CURSOR.value=n;           
          break}}}                                        
 function dfhinqcursor(n)                                 
   {document.form3270.DFH_CURSOR.value=n}                 
 // -->
</script>
</head>
<body Start of changeonLoad="dfhsetcursor('&DFH_CURSORPOSN;')">End of change 
You can modify the appearance of the page by providing your own heading section. For more information, see Modifying the output from DFHWBTTA.

The screen image section

This section of the HTML page is generated directly from an internal representation of a 3270 screen image, whose size is determined from the DEFSCREEN and ALTSCREEN definitions on the FACILITYLIKE terminal definition associated with your transaction. It contains the following elements:
Normal HTML text
Simulates protected fields
Text input elements
Simulate unprotected fields. Each element is given a name which is 11 characters long, and has the following form:
Frrcccllll_
where
  • rr is a two-digit number which denotes the row in which the field is displayed on a 3270 screen.
  • ccc is a three-digit number which denotes the column in which the field is displayed on a 3270 screen.
  • llll is a four-digit number which denotes the length of the field.
For example:
  • A field at row 1 and column 1 on a 3270 display, and which has a length of 78 bytes will be named
    F010010078_
Text elements with a check box
Simulate detectable fields. See Using detectable fields for more information.
Hidden elements
A hidden element named DFH_STATE_TOKEN is used to maintain the display state seen by the application over a number of interactions with the Web client.

A hidden element (DFH_CURSOR) and a JavaScript function (dfhinqcursor()) cooperate to return the cursor position to the application. Start of changeCICS uses the JavaScript focus() method to position the cursor in the input box or field specified by DFH_CURSOR. Note that focus() cannot position the cursor over a particular character within the input box or field, but only at the first character position.End of change

<!doctype html public "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<title>CICS Web support screen emulation - tranid</title>
<meta name="generator" content="CICS Transaction Server/2.1.0">
<script language="JavaScript">
<!--
 function dfhsetcursor(n)
  {for (var i=0;i<document.form3270.elements.length;i++)  
     {if (document.form3270.elements[i].name == n)        
         {document.form3270.elements[i].focus();          
          document.form3270.DFH_CURSOR.value=n;           
          break}}}                                        
 function dfhinqcursor(n)                                 
   {document.form3270.DFH_CURSOR.value=n}                 
 // -->
</script>
</head>
<body
Start of changeonLoad="dfhsetcursor('&DFH_CURSORPOSN;')">End of change  
The HTML generated from the 3270 screen image is similar to the HTML generated in the templates for BMS maps. The horizontal and vertical alignment of information on the page is achieved using an HTML table:
  • The HTML table contains one column for each different column of the 3270 screen that contains the start of a field. For example, if the 3270 screen contains fields that start in columns 2, 11, 21 and 55, then the HTML table will contain four columns. Thus, all fields whose starting positions are vertically aligned in the 3270 screen will appear vertically aligned in the HTML page.
  • The HTML table contains one row for each row of the 3270 screen that contains the start of a field. Thus, all fields whose starting positions are horizontally aligned in the 3270 screen will appear horizontally aligned in the HTML page. Rows on the 3270 screen that do not contain fields are not represented in the HTML table.
  • Within the table, text is displayed in a proportional font
Consider a 3270 screen containing the following fields:
Field Row Starting Column
Field_1 2 2
Field_2 3 2
Field_3 3 35
Field_4 4 2
Field_5 4 35
Field _6 9 2
Field_7 9 18
Field_8 9 35
All the fields start in column 2, 18, or 35 of the 3270 screen. Therefore the resulting HTML table will have three columns. Similarly, all the fields are located on row 2, 3, 4, or 9 of the 3270 screen, so the HTML table will have four rows.

You can use the encode function of a converter program to modify the screen image section. For more information, see Using a converter program with DFHWBTTA.

The footing section

CICS Web support generates the following footing section. Each attention key supported by the 3270 display is simulated as a submit button. When the end user selects one of these buttons, the corresponding variable is transmitted in the HTTP request. CICS uses the variable to determine which AID to simulate in the 3270 application. An additional submit button named DFH_PEN is used with detectable fields.
<input type="submit" name="DFH_PF1"  value="PF1">
<input type="submit" name="DFH_PF2"  value="PF2">
<input type="submit" name="DFH_PF3"  value="PF3">
<input type="submit" name="DFH_PF4"  value="PF4">
<input type="submit" name="DFH_PF5"  value="PF5">
<input type="submit" name="DFH_PF6"  value="PF6">
<input type="submit" name="DFH_PF7"  value="PF7">
<input type="submit" name="DFH_PF8"  value="PF8">
<input type="submit" name="DFH_PF9"  value="PF9">
<input type="submit" name="DFH_PF10"  value="PF10">
<input type="submit" name="DFH_PF11"  value="PF11">
<input type="submit" name="DFH_PF12"  value="PF12">
<br>
<input type="submit" name="DFH_PF13"  value="PF13">
<input type="submit" name="DFH_PF14"  value="PF14">
<input type="submit" name="DFH_PF15"  value="PF15">
<input type="submit" name="DFH_PF16"  value="PF16">
<input type="submit" name="DFH_PF17"  value="PF17">
<input type="submit" name="DFH_PF18"  value="PF18">
<input type="submit" name="DFH_PF19"  value="PF19">
<input type="submit" name="DFH_PF20"  value="PF20">
<input type="submit" name="DFH_PF21"  value="PF21">
<input type="submit" name="DFH_PF22"  value="PF22">
<input type="submit" name="DFH_PF23"  value="PF23">
<input type="submit" name="DFH_PF24"  value="PF24">
<br>
<input type="submit" name="DFH_PA1"   value="PA1">
<input type="submit" name="DFH_PA2"   value="PA2">
<input type="submit" name="DFH_PA3"   value="PA3">
<input type="submit" name="DFH_CLEAR" value="Clear">
<input type="submit" name="DFH_ENTER" value="Enter">
<input type="submit" name="DFH_PEN"   value="Pen">
<input type="reset"  value="Reset">
</form>
</body>
</html>

You can modify the appearance of the page by providing your own footing section. For more information, see Modifying the output from DFHWBTTA.