定義精靈頁面

此系列包含兩個頁面：第一個頁面需要使用者輸入雇主詳細資料，而第二個頁面則需要使用者輸入日期。

圖 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>

已透過併入屬性為 MODE="WIZARD_PROGRESS_BAR" 的 MENU 元素，將精靈進度列構件新增至頁面。此元素參照稱為 Wizard 的常數。在 Constants.properties 中，此內容的值定義為 CreateEmploymentWizard。這是每一個頁面與精靈進度列配置的關聯方式，該配置已載入至此範例的資料庫中。

精靈第一個頁面的對應 .properties 包括該頁面的可本地化內容：

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

Control.Label.Next=Next

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

下列是顯示精靈進度列的第二個頁面：

圖 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>

對應的 .properties 包括頁面的可本地化內容：

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

Field.Label.FromDate=From
Field.Label.ToDate=To
上層主題： 使用精靈進度列