1. Open the select WebRoutine in the Design view. It should look like the following:



  2. Add a column to the table containing employee number and drop a Push button with image weblet into the new cell. Delete the placeholder characters. Set up the push button as follows:

    Property

    Value

    caption

    Submit

    left_relative_image_path

    icons/normal/16/zoom.png

    on_click_wrname

    Showpage

    submitExtraFields


    Field Name: STDRENTRY

    Literal Value: S


    Your page should look like the following:



  3. Drop an jQuery UI AutoComplete weblet onto the Employee Number field and set up its properties as follows:

    Property

    Value

    sourceWamName

    iiiEmpAutoCmpl

    sourceWrName

    Empno_Prompt

    termField

    EMPNO

    listName

    EMP_DD

    valueField

    EMPNO


    Note that if the WAM iiiEmpAutoCmpl is open in the editor, you will be able to select all of these values from a dropdown.

  4. Use the context menu to Insert HTML / Table with one row and two columns, below the existing table. Use the cursor keys to move to the left of this new table and press Enter a number of times to position this table towards the bottom of the central area of the screen.

  5. Add a push button with images into each cell of the new table. Set up the push buttons as follows:

    Property

    Value

    Caption

    Show Saved List

    left_relative_image_path

    /icons/normal/16/blacklist_16.png

    on_click_wrname

    Showlist

    Property

    Value

    Caption

    Clear Saved List

    left_relative_image_path

    /icons/normal/16/cross_16.png

    on_click_wrname

    Select

    submitExtraFields


    Field Name: STDRENTRY

    Literal Value: C


    Your web page should look like the following:



  6. Save your changes.

  7. Open the ShowPage WebRoutine in the design view. Your web page should look like the following:


    1. Note that Start Date, Last Updated, Comments, Gender, Current Employee and Create Time are all shown as weblets. For example click on the Start Date field and select the Details tab. Note that this is the std_datepicker weblet.
      These weblets are all defined as weblet field visualizations in the Repository.
    2. Select Last Review Notes and then Terminate Date and check their definition using the Details tab. Notice that they have also been defined in the web page as weblets (std_varchar and std_DatePicker respectively) based on their field type. These are fields you defined in the WAM.
    3. The single character (Alphanumeric) fields Marital Status and On Leave are input fields. In the Design view you will replace these with weblets.

  8. Select the field Start Date and set up its properties as follows:

    Property

    Value

    changeMonth

    True

    changeYear

    True

    showOtherMonths

    True

    selectOtherMonths

    True

    You will be able to see the effect of these settings once you test the WAM.
    Change the dateFormat property to be correct for your region. mm/dd/yyyy is the default value.
    Also change the dateFormat for fields Terminate Date and Last Updated to suit your region.

  9. Select the Comments field and set up its properties as follows:

    Property

    Value

    Type

    memo

    word_wrap

    soft

    Note that the Comments field is now a memo box.

  10. Select the Current Employee checkbox and change its caption to ''. The caption should now be blank. 
    Note that the oncode and offcode properties for the check box weblet are values of Y and N which are correct for this field. These values could be changed if necessary.

  11. Drop a Radio Group weblet onto the field Marital Status. On the Details tab, in the items property's value column, use the Ellipsis button to open the Design of… dialog to define three captions and values as shown:

    Caption

    Value

    Married

    M

    Single

    S

    Divorced

    D



  12. Drop a Check Box weblet onto the On Leave field and set its caption to ''.     Once again the default oncode and offcode values are suitable for this field.

  13. Select the Last Review Notes field (std_varchar weblet) and set its properties as for the Comments field in sub step 9.  Select the Comments field and set up its properties as follows:.

  14. Select the Terminate Date field (std_DatePicker weblet) and set its properties as for the Start Date in sub step 8.  Select the field Start Date and set up its properties as follows:.

  15. Save your changes.

  16. Drop a Push Button with Image weblet into the bottom right of the table, next to the Terminate Date field. Set up its properties as follows:

    Property

    Value

    Caption

    Save

    left_relative_image

    icons/normal/16/check_mark_16.png

    on_click_wrname

    Showpage

    submitExtraFields


    Field Name: STDRENTRY

    Literal Value: U



  17. In this step you will add a link to the Show Saved List page to return to the Select Employee Number page.
    1. Open the showlist WebRoutine in the Design view.
    2. Drop a Push Button with Images onto the page, below the list.
    3. Set up the push button properties as follows:

      Property

      Value

      caption

      Select Employee

      left_relative_image

      icons/normal/16/zoom.png

      on_click_wrname

      Select

      submitExtraFields


      Field Name: STDRENTRY

      Literal Value: T

      Note: The dateFormat = Auto property for the DatePicker weblet, will be correct for most applications. The date format will be determined by the partition's ISO Language setting. For the UK this should be en-GB since en will give DD/MM/YYYY.

           
  18. Save your changes.