The content of a modal dialog is just a standard UIM page, though it is styled different when it is displayed by the browser. Specifically, in the modal dialog that we are going to define,
Defining the content of the modal dialog shows the UIM code for this modal dialog.
<PAGE PAGE_ID="CreateEmployments" WINDOW_OPTIONS="width=250"> <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> <SERVER_INTERFACE NAME="ACTION" CLASS="EmploymentFacade" OPERATION="createEmployment" PHASE="ACTION"/> <CLUSTER TITLE="Cluster.Title.Details" NUM_COLS="2"> <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> <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"> <ACTION_CONTROL LABEL="Control.Label.Cancel" TYPE="SUBMIT"/> </ACTION_SET> </PAGE>
One element to note is the WINDOW_OPTIONS attribute of the PAGE element. In this example, the width has been set to 250. As no height is set, it will be automatically calculated when the dialog is displayed.
The corresponding .properties should contain the localizable content for the modal dialog:
Page.Title=Create Employment Cluster.Title.Details=Details Field.Value.Welcome=Here's the details panel for a person Control.Label.Save=Save Control.Label.Cancel=Cancel Field.Label.PersonID=Person ID Field.Label.EmployerName=Employer Name Field.Label.JobTitle=Job Title Field.Label.FromDate=From Field.Label.ToDate=To