1. Create a new WAM with:

         Name: iiiEmpEnqMap
         Description: Employee Enquiry with Map
         Layout Template: iiilay01

    Create the WAM by copying the following code into the default WAM source:
         Group_By Name(#empgroup) Fields((#SURNAME *OUT) (#GIVENAME *OUT) (#ADDRESS1 *OUT) (#ADDRESS2 *OUT) (#ADDRESS3 *OUT) (#POSTCODE *OUT) (#PHONEHME *OUT) (#PHONEBUS *OUT) (#DEPTMENT *OUT) (#SECTION *OUT) (#SALARY *OUT) (#STARTDTE *OUT) (#TERMDATE *OUT))
         Define #ADDRESS Type(*string) Length(1000)
         Webroutine Name(begin) Desc('Select Employee')
         Web_Map For(*output) Fields(#empno)
         Endroutine
         Webroutine Name(DETAILS) Desc('Employee Details')
         Web_Map For(*BOTH) Fields((#EMPNO *OUTPUT)(#ADDRESS *hidden))
         Web_Map For(*OUTPUT) Fields(#empgroup)
         Fetch Fields(#empgroup) From_File(PSLMST) With_Key(#EMPNO) Val_Error(*NEXT)
         If_Status Is_Not(*OKAY)
         Message Msgtxt('Employee not found')
         Transfer Toroutine(begin)
         Endif
         Endroutine

  2. Compile the WAM.

  3. Add a push button to the begin web page.

    1. Open the begin WebRoutine in the Design view.
    2. Add a column to the fields table.
    3. Add a push button in the new column.
    4. Set up the button with a caption of Details and an on_click_wrname of details.
    5. Remove the * placeholder characters.
    6. Save your changes.

  4. Open the Details WebRoutine in the Design view.

    1. Add a column to the fields table
    2. With the top row in the new column selected, set its rowspan property to 14.
    3. Click inside the new column and use the context menu to Insert HTML / Div. Your design should look like the following:
    4. With the DIV still selected, select the Details tab. Expand its Style property and set the following properties:

      Property

      Value

      Height

      340px

      Margin-left

      50px

      Width

      340px


      Your design should look like the following:
    5. Delete the * place holder characters from this column.
    6. Save your changes.
    7. Drop a clickable image weblet into the DIV.
    8. Select the clickable image and set its absolute_image_path to #ADDRESS.
      Enter #ADDRESS in the XPath Expression window.
    9. Save your changes.