Configuring the dialog

Before you can configure the dialog component, you must first add a button in the component from where you can open the dialog. Then, create the data service that is used in the dialog. You must create and configure the properties of the data service. Ensure to leave the Input tab unconfigured. Click the Save button on the application.
  1. On the application, click the Manage Dialogs icon.
  2. In the Dialogs Manager Configuration window, click + Create Dialog.
  3. Specify the component ID in the Component ID field. See Naming recommendation for components.
  4. Click the General Settings tab and specify the component heading in the Component heading field. The component heading you specified is displayed as the heading of the dialog. To enable the translation keys, enclose the name in <> and do not use spaces. See Configuring translations.
  5. Click the Operations tab and select a data service to connect it to the component under the Standard tab. Connect the data service to the Submit operation.

    An operation indicates how the data is used by the component. The default operations for dialog are Submit and Open. Submit is used for data services that use get, list, add, copy, update, or search transactions. Open opens the dialog and does not need a data service connected to it.

  6. Click the Operations tab and select a data service to connect it to the dialog. Connect the data service to the Submit operation. An operation indicates how the data is used by the dialog. Experience Designer includes these default operations for dialogs:
    • Submit: Run the data service's transaction.
    • Open: Open the dialog.
  7. Click the Interactions tab and click + Add. Specify this information:
    Source component
    Select the component where the button that you must connect to the dialog is located.
    Component element
    Select the button that you must connect to the dialog.
    Event
    Select Click.
    Operation
    Select Open.
  8. Click Save.
  9. To add fields to the dialog, click Fields.
  10. Click + Add and select fields to display in the dialog.

    The available fields are the input fields of the data service that is connected to the dialog. If the data service contains several API transactions, all the input fields of the transactions are available in the field list. You can see which transaction each field belongs to in the Transaction column.

  11. Click the Read-only icon to disable a field from being modified.
  12. To require the field to be filled out, click Required.
  13. To hide a field by selecting the Hidden check box.
  14. Click the Edit icon and specify the Custom label field for the selected field.

    The specified custom label overrides the field label retrieved from the data service. To enable the translation keys, enclose the name in <> and do not use spaces.

    See Configuring translations.

    To change the type of field, click Type and select which type of field from the list.

  15. To override the standard browse on a field, configure the field to use an API transaction you prefer. At first, create a new data service and add the API transaction you want to use when browsing.
    Note: To work properly, it must be a search transaction.

    Click the Fields tab and click the Edit icon on a field row. Ensure that the field you want to configure browse for is of Lookup type. In Browse data service field, select the data service that you want to use when browsing on the field. To select which field in the API transaction is returned to the Browse field as the value, specify a field in the Return value field text box. To select which field is used as explanatory text next to the Browse field on the component, specify a field in Additional field text box.

    Below is an example:

    You have a form where you want to be able to create a new item based on copying a template. In order to do that, in the Create New Item dialog, the Item number field must be able to browse for items in status 05 only. Using MMS200MI/SearchItems, create a new data service called Browse_ItemTemplates and specify STAT:05 SortBy:ITNO as the search query value. On the dialog configuration, click the Fields tab and then update the ITNO field. Select the data service Browse_ItemTemplates in the Browse data service field and add ITNO in the Return value field text box. Finally, add ITDS in the Additional field text box. Now, when you browse on the item number field in the dialog window, you only see items in status 05 and sorted by item number. When you select an item number in the dialog window, the item description is displayed next to the field.

  16. To add initial values to the fields when opening the dialog, specify the values in the Initial Value column for each field.
  17. You can specify a hard-coded value, like numbers or letters, or a customized value that depends on which record is selected. To do this, specify Source and Source field similar to this format {componentID.SourceField} in the Initial Value column.
    For example, an index list called IndexList_Customers is used to display customers. A field in the dialog shows the selected customer’s name. The initial value for the dialog field is {IndexList_Customers.CUNM}.
  18. Click the Dialog Buttons tab and click the Edit icon for each button and fill out the Label field to change the label used for the buttons. To enable the translation keys, enclose the name in <> and do not use spaces.

    See Configuring translations.

    You can rearrange the order of the buttons by clicking the three vertical dots on each row of the buttons and drag them up or down in the list. To delete a button, select the button and click Delete. To add a button, click + Add, select Standard button, and then select the button you want to display in the dialog.

  19. To save the configuration for the dialog, click Save.
  20. To ensure that the configuration in the dialog is applied, click the Save button on the application.
  21. In the data service you created for the dialog, click the Input tab and specify this information:
    Source

    For the dialog to work, you must specify which fields from the dialog you prefer to use as the input to the API transaction. Select the components or dialogs from where the input value is retrieved. The components and dialog windows must exist with component IDs to display in the source list. If a source is not yet in the source list, create it and specify a component ID.

    Source Field
    Select a field from the source you specified that you prefer to use as the input.
    Value
    You can specify a hard-coded value such as a number or a letter. You can also customize the input value based on which record is selected. To do so, specify the Source and the Source field in the {componentID.SourceField} format in the Value column.
  22. Click the two Save buttons in the Data Services Configuration window.
  23. To ensure that the dialog configuration you added and configured is applied, click the Save button on the application.