Step 11. Create Page Component for Function iiiFN12 (Optional)

In this step, you will create a page component for the HTML of function iiiFN12.  The page component will allow you to easily manipulate the appearance of iiiFN12 and it will prevent changes to the HTML from being replaced when the function is recompiled. You will also change the HTML to display the Employee photo.

1.  Using the Web Function Editor, open a new document.

2.  Delete the default HTML which appears in the new page.

3.  Open the iiiPROC03 iiiFN120001 HTML page.

4.  Copy all the HTML statements in the table definition, i.e. copy all code between the following tags

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=3>

<TBODY>

 

copy all HTML code here but do not include the table tags shown above and below

 

</TBODY>

</TABLE>

 

5.  Paste the HTML code into your new page. Your code should appear as follows:

<TR>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0001+0001+0015"></STRONG></TD>

<TD><RDML MERGE="EMPNO     "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0002+0016+0030"></STRONG></TD>

<TD><RDML MERGE="GIVENAME  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0003+0031+0045"></STRONG></TD>

<TD><RDML MERGE="SURNAME   "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0004+0046+0060"></STRONG></TD>

<TD><RDML MERGE="ADDRESS1  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0005+0061+0075"></STRONG></TD>

<TD><RDML MERGE="ADDRESS2  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0006+0076+0090"></STRONG></TD>

<TD><RDML MERGE="ADDRESS3  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0007+0091+0105"></STRONG></TD>

<TD><RDML MERGE="POSTCODE  " EDITCODEO="3"></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0008+0106+0120"></STRONG></TD>

<TD><RDML MERGE="PHONEHME  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0009+0121+0135"></STRONG></TD>

<TD><RDML MERGE="SALARY    " EDITCODEO="1"></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0010+0136+0150"></STRONG></TD>

<TD><RDML MERGE="DEPTMENT  "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0011+0151+0165"></STRONG></TD>

<TD><RDML MERGE="SECTION   "></TD>

</TR>

<TR>

<TD><STRONG><RDML MERGE="@T0012+0166+0180"></STRONG></TD>

<TD><RDML MERGE="PHONEBUS  "></TD>

</TR>

 

6.  Delete all of the field labels whose format is:

<<RDML MERGE="@T...">

 

      and replace the labels with field descriptions.

     Also add an <IMG SRC= > tag to display the PHONEBUS as an image.

     The final pages might appear as follows(changes are in bold):

<TR>

</TR>

<TR>

<TD><STRONG>Employee Number</STRONG></TD>

<TD><RDML MERGE="EMPNO     "></TD>

</TR>

<TR>

<TD><STRONG>First Name</STRONG></TD>

<TD><RDML MERGE="GIVENAME  "></TD>

</TR>

<TR>

<TD><STRONG>Last Name</STRONG></TD>

<TD><RDML MERGE="SURNAME   "></TD>

</TR>

<TR>

<TD><STRONG>Address Line 1</STRONG></TD>

<TD><RDML MERGE="ADDRESS1  "></TD>

</TR>

<TR>

<TD><STRONG>City</STRONG></TD>

<TD><RDML MERGE="ADDRESS2  "></TD>

</TR>

<TR>

<TD><STRONG>State</STRONG></TD>

<TD><RDML MERGE="ADDRESS3  "></TD>

</TR>

<TR>

<TD><STRONG>Postal Code</STRONG></TD>

<TD><RDML MERGE="POSTCODE  " EDITCODEO="3"></TD>

</TR>

<TR>

<TD><STRONG>Home Phone</STRONG></TD>

<TD><RDML MERGE="PHONEHME  "></TD>

</TR>

<TR>

<TD><STRONG>Salary</STRONG></TD>

<TD><RDML MERGE="SALARY    " EDITCODEO="1"></TD>

</TR>

<TR>

<TD><STRONG>Department</STRONG></TD>

<TD><RDML MERGE="DEPTMENT  "></TD>

</TR>

<TR>

<TD><STRONG>Section</STRONG></TD>

<TD><RDML MERGE="SECTION   "></TD>

</TR>

<TR>

<TD><STRONG>Employee Image</STRONG></TD>

<TD><IMG SRC="/images/<RDML MERGE="PHONEBUS  ">"></TD>

</TR>

 

     REMINDER: Add the <IMG SRC=...> tag to display the image in the PHONEBUS field.

7.  Save the document as iiiFN12P with description iiiFN12 Page Component.

8.  Using the Web Function Editor, open the Maintain Components window.

9.  Select Add, to add a new component as follows (where iii is your course assigned ID):

Component

iiiFN12P

Type

Page

 

 

Description

iiiFN12 Page Component

Page

iiiFN12P

Mode

OUTPUT

 

  

10.   Close the Maintain Components window.

11.  Working with your iiiPROC03 process, edit the function named iiiFN12 Employee Details.

12.  Define a working field named iiiFN12P to be used with the output Web page component and insert a REQUEST command prior to the existing REQUEST command in the function.  The new REQUEST will display only one field iiiFN12P with attributes of *OUTPUT and *NOID.

     Your finished code might appear as follows  (where iii is your course assigned ID):

FUNCTION  (*DIRECT *WEBEVENT)
DEFINE    FIELD(#iiiFN12P) TYPE(*CHAR) LENGTH(1)
GROUP_BY   NAME(#EMPLOYEE) FIELDS((#EMPNO *OUTPUT) (#GIVENAME *OUTPUT) (#SURNAME *OUTPUT) (#ADDRESS1 *OUTPUT) (#ADDRESS2 *OUTPUT) (#ADDRESS3 *OUTPUT) (#POSTCODE *OUTPUT) (#PHONEHME *OUTPUT) (#SALARY *OUTPUT) (#DEPTMENT *OUTPUT) (#SECTION *OUTPUT) (#PHONEBUS *OUTPUT))
FETCH     FIELDS(#EMPLOYEE)) FROM_FILE(PSLMST) WITH_KEY(#EMPNO) IO_STATUS(*STATUS) IO_ERROR(*NEXT) VAL_ERROR(*NEXT)                                           
REQUEST   FIELDS((#iiiFN12P *OUTPUT *NOID)) EXIT_KEY(*NO) MENU_KEY(*NO)
REQUEST   FIELDS(#EMPLOYEE) EXIT_KEY(*NO) MENU_KEY(*NO)

 

  

13.  Exit and save your RDML function.

14.  Compile your RDML function iiiPROC03/iiiFN12.