Definition of Wizard Pages.

The sequence will contain two pages; the first requires the user to enter employer details and the second requires the user to enter dates.

Figure 1. CreateEmploymentWizard_pageOne.uim
<PAGE PAGE_ID="CreateEmploymentWizard_pageOne">

  <MENU MODE="WIZARD_PROGRESS_BAR">
      <CONNECT>
        <SOURCE NAME="CONSTANT" PROPERTY="Wizard" />
      </CONNECT>
  </MENU>

  <SERVER_INTERFACE NAME="ACTION" CLASS="EmploymentFacade"
    OPERATION="validateEmployerAndJobTitle" PHASE="ACTION"/>

  <PAGE_TITLE>
    <CONNECT>
      <SOURCE NAME="TEXT" PROPERTY="Page.Title"/>
    </CONNECT>
  </PAGE_TITLE>

  <CONNECT>
    <SOURCE NAME="PAGE" PROPERTY="personID"/>
    <TARGET NAME="ACTION" PROPERTY="personID"/>
  </CONNECT>

  <PAGE_PARAMETER NAME="personID"/>

  <CLUSTER TITLE="Cluster.Title.Details">
    <FIELD LABEL="Field.Label.EmployerName">
      <CONNECT>
        <TARGET NAME="ACTION" PROPERTY="employerName"/>
      </CONNECT>
    </FIELD>
    <FIELD LABEL="Field.Label.JobTitle">
      <CONNECT>
        <TARGET NAME="ACTION" PROPERTY="jobTitle"/>
      </CONNECT>
    </FIELD>

  </CLUSTER>

  <ACTION_SET TOP="false">
    <ACTION_CONTROL LABEL="Control.Label.Next" TYPE="SUBMIT">
      <LINK PAGE_ID="CreateEmploymentWizard_pageTwo"
        DISMISS_MODAL="false">
        <CONNECT>
           <SOURCE NAME="ACTION" PROPERTY="personID"/>
           <TARGET NAME="PAGE" PROPERTY="personID"/>
        </CONNECT>
        <CONNECT>
           <SOURCE NAME="ACTION" PROPERTY="employerName"/>
           <TARGET NAME="PAGE" PROPERTY="employerName"/>
        </CONNECT>
        <CONNECT>
          <SOURCE NAME="ACTION" PROPERTY="jobTitle"/>
          <TARGET NAME="PAGE" PROPERTY="jobTitle"/>
        </CONNECT>
      </LINK>
      </ACTION_CONTROL>
  </ACTION_SET>
</PAGE>

The wizard progress bar artifacts are added to the page through the inclusion of a MENU element with the attribute MODE="WIZARD_PROGRESS_BAR". The element references a constant called Wizard. The value of this property is defined in Constants.properties as CreateEmploymentWizard. This is how each page is associated with the wizard progress bar configuration already loaded into the database for this example.

The corresponding .properties for the first page of the wizard includes the localizable content for that page:

Page.Title=Create Employment
Cluster.Title.Details=Details

Control.Label.Next=Next

Field.Label.EmployerName=Employer Name
Field.Label.JobTitle=Job Title

The following is the second page that displayes the wizard progress bar:

Figure 2. CreateEmploymentWizard_pageTwo.uim
<PAGE PAGE_ID="CreateEmploymentWizard_pageTwo">

  <MENU MODE="WIZARD_PROGRESS_BAR">
        <CONNECT>
          <SOURCE NAME="CONSTANT" PROPERTY="Wizard" />
        </CONNECT>
  </MENU>

  <PAGE_TITLE>
    <CONNECT>
      <SOURCE NAME="TEXT" PROPERTY="Page.Title"/>
    </CONNECT>
  </PAGE_TITLE>

  <PAGE_PARAMETER NAME="personID"/>

  <CONNECT>
    <SOURCE NAME="PAGE" PROPERTY="personID"/>
    <TARGET NAME="ACTION" PROPERTY="personID"/>
  </CONNECT>

  <PAGE_PARAMETER NAME="employerName"/>

  <CONNECT>
    <SOURCE NAME="PAGE" PROPERTY="employerName"/>
    <TARGET NAME="ACTION" PROPERTY="employerName"/>
  </CONNECT>


  <PAGE_PARAMETER NAME="jobTitle"/>

  <CONNECT>
      <SOURCE NAME="PAGE" PROPERTY="jobTitle"/>
      <TARGET NAME="ACTION" PROPERTY="jobTitle"/>
  </CONNECT>

  <SERVER_INTERFACE NAME="ACTION" CLASS="EmploymentFacade"
    OPERATION="createEmployment" PHASE="ACTION"/>

  <CLUSTER TITLE="Cluster.Title.Details" NUM_COLS="2">

    <FIELD LABEL="Field.Label.FromDate">
      <CONNECT>
        <TARGET NAME="ACTION" PROPERTY="fromDate"/>
      </CONNECT>
    </FIELD>
    <FIELD LABEL="Field.Label.ToDate">
      <CONNECT>
        <TARGET NAME="ACTION" PROPERTY="toDate"/>
      </CONNECT>
    </FIELD>
  </CLUSTER>

  <ACTION_SET TOP="false">
    <ACTION_CONTROL LABEL="Control.Label.Save" TYPE="SUBMIT">
      <LINK PAGE_ID="Employments" DISMISS_MODAL="TRUE">
        <CONNECT>
    <SOURCE NAME="ACTION" PROPERTY="personID" />
    <TARGET NAME="PAGE" PROPERTY="personID"/>
        </CONNECT>
      </LINK>
    </ACTION_CONTROL>
  </ACTION_SET>

</PAGE>

The corresponding .properties is includes the localizable content for the page:

Page.Title=Create Employment
Cluster.Title.Details=Details
Control.Label.Save=Save

Field.Label.FromDate=From
Field.Label.ToDate=To