The MULTISELECT Widget

The MULTISELECT widget allows you to specify that the first column in a LIST should contain a check-box on each row and to allow several rows to be selected. A "Select All" feature can be enabled which displays a check-box in the column header. See ENABLE_SELECT_ALL_CHECKBOX for further details.

Each check box can represents multiple entities in the row. For each check box that is selected, the fields on that row will be compiled into a " | " delimited string and each row will be tab delimited and passed as a page parameter when a specific type of page link is activated.

The UIM document in The MULTISELECT Widget is an example of a page with multiple rows with check boxes. When the form is submitted, a single string, containing multiple fields for each selected row, is passed to the in$tabbedString field on the target page. Following the UIM is a detailed description of each relevant part of the UIM that implement this functionality.

Figure 1. MULTISELECT Example
          <PAGE PAGE_ID="MultiSelectWidgetTest"
      xsi:noNamespaceSchemaLocation="CuramUIMSchema"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

  <SERVER_INTERFACE NAME="DISPLAY" CLASS="MyBean"
                    OPERATION="Display" PHASE="DISPLAY"/>
  <SERVER_INTERFACE NAME="ACTION" CLASS="MyBean"
                    OPERATION="Submit" PHASE="ACTION"/>

  <LIST TITLE="List.Title">
    <ACTION_SET BOTTOM="false">
      <ACTION_CONTROL TYPE="SUBMIT">
        <LINK PAGE_ID="MultiSelectWidgetResult">
          <CONNECT>
            <SOURCE NAME="ACTION"
                    PROPERTY="in$tabbedString"/>
            <TARGET NAME="PAGE"
                    PROPERTY="referenceNumTabString"/>
          </CONNECT>
        </LINK>
      </ACTION_CONTROL>
    </ACTION_SET>
    <CONTAINER LABEL="List.Multiselect.Header" WIDTH="5"
               ALIGNMENT="CENTER">
           <WIDGET TYPE="MULTISELECT"
                                 HAS_CONFIRM_PAGE="true">
        <WIDGET_PARAMETER NAME="MULTI_SELECT_SOURCE">
          <CONNECT>
            <SOURCE PROPERTY="personID" NAME="DISPLAY"/>
          </CONNECT>
          <CONNECT>
            <SOURCE PROPERTY="caseID" NAME="DISPLAY"/>
          </CONNECT>
        </WIDGET_PARAMETER>
        <WIDGET_PARAMETER NAME="MULTI_SELECT_TARGET">
          <CONNECT>
            <TARGET PROPERTY="in$tabbedString" NAME="ACTION"/>
          </CONNECT>
        </WIDGET_PARAMETER>
        <WIDGET_PARAMETER NAME="MULTI_SELECT_INITIAL">
          <CONNECT>
            <SOURCE NAME="DISPLAY" PROPERTY="out$tabString"/>
          </CONNECT>
        </WIDGET_PARAMETER>
      </WIDGET> 
          </CONTAINER>
    <FIELD LABEL="Field.Title.ReferenceNumber" WIDTH="35">
      <CONNECT>
        <SOURCE NAME="DISPLAY" PROPERTY="personID"/>
      </CONNECT>
    </FIELD>
    <FIELD LABEL="Field.Title.Forename" WIDTH="30">
      <CONNECT>
        <SOURCE NAME="DISPLAY" PROPERTY="firstName"/>
      </CONNECT>
    </FIELD>
    <FIELD LABEL="Field.Title.Surname" WIDTH="30">
      <CONNECT>
        <SOURCE NAME="DISPLAY" PROPERTY="surname"/>
      </CONNECT>
    </FIELD>
  </LIST>
</PAGE>

The main points to note in the above UIM example are:

  • The WIDGET of TYPE equal to MULTISELECT is a child node of a CONTAINER element. The container's label will be used as the column header unless the select all check box is enabled in curam-config.xml. See ENABLE_SELECT_ALL_CHECKBOX for further details.
  • Up to three WIDGET_PARAMETER elements are allowed within the WIDGET element. MULTI_SELECT_SOURCE and MULTI_SELECT_TARGET are mandatory and MULTI_SELECT_INITIAL is optional.
  • The MULTI_SELECT_SOURCE can have multiple CONNECT elements, each with one SOURCE element. Each SOURCE is added to the " | " delimited string. If only one SOURCE element is specified the string will not contain any " | " delimiters. Then each select row will be delimited by a tab character.
  • The MULTI_SELECT_TARGET element must contain only one CONNECT element with only one TARGET element. This TARGET element specifies the field on the action phase bean that the " | " and tab-delimited string will be assigned to when the page is submitted.
  • The MULTI_SELECT_INITIAL contains only one CONNECT element with a single SOURCE element. This contains a " | " and tab-delimited string which specifies the rows that are selected when the page is loaded.
  • In the LIST element the ACTION_SET has one ACTION_CONTROL element.
  • Optional HAS_CONFIRM_PAGE attribute is used to indicate that the page with MULTISELECT widget submits to a confirmation page, where user selection is re-displayed for confirmation. See Confirmation Pages

Below is an example of the delimited string passed as a parameter to the specified page.

101|case121    102|case122    103|case123

NOTE: The MULTISELECT widget does not support the list pagination feature and all it's items will be displayed within one scrollable list. See PAGINATION and LIST for more details on pagination support.

Table 1. Parameters to the MULTISELECT Widget

Parameter Name

Required

Description and Connections

MULTI_SELECT_SOURCE

Yes

This parameter can include multiple CONNECT elements that must specify a SOURCE end-point.

The SOURCE end-point must be a list property containing the key data for the row.

MULTI_SELECT_TARGET

Yes

This parameter must include one CONNECT element that must specify a TARGET end-point.

The TARGET end-point must be a string property containing the key data for selected rows.

MULTI_SELECT_INITIAL

No

This parameter must include one CONNECT element that must specify a SOURCE end-point.

The SOURCE end-point must be a string property containing the key data for the rows that are initially check when page is loaded.