Create a mobile pop-up

Learn how to display configurable mobile pop-ups based on real-time conditions. You can display these pop-ups at the mobile app login phase or after a button tap.

Before you begin

Role required: admin

Before configuring your mobile pop-ups, consider the following:

• Mobile cards are used in the display of pop-ups. You can either design one of your own mobile cards or use one of the template cards provided. For more information, see Mobile Card Builder.
• Supported button types that trigger pop-ups are action item and navigation. For more information, see Action functions.
• All button locations are supported. For example, swipe, top menu action, and footer function.
• Buttons are supported in the following UI sections, record, icon, media, and content. For more information, see Launcher screen UI sections.
• Mobile pop-ups aren't supported in offline.

Procedure

1. Navigate to All > System Mobile > Mobile App Builder.
   The Mobile App Builder opens in a new browser tab and displays the application scope selection screen.
2. Search for the application scope you are working in and then select the name of the application scope.
   The Mobile App Builder categories home screen displays.
3. Select All mobile records from the menu.
4. From the Record type drop-down list, select Mobile event [sys_sg_event], and then select New.
5. Complete the following fields as needed:

   Table 1. Mobile event form

   Field	Description
   Properties
   Name	The name for your mobile event, which activates the mobile pop-up.
   Description	Additional information about the mobile event.
   Active	Whether the mobile event is activated.
   Type	Type of event that triggers the pop-up.
   Source table	The source table for this mobile event.
   Source record	Determine either the mobile app config or the mobile function as the record that this event occurs on. The options are dependent on the selection made from the Source table field.
   Event action	The action that occurs when the mobile event is triggered. Note: There can only be one action per event.

6. Select from the Type field whether the triggered event occurs when the user logs in or when a button is selected.
   Select either:

   • OnLogin: The mobile pop-up displays after a user enters their credentials and logs in.
   • OnButtonClick: The mobile pop-up displays when the user selects a specified button function.
7. Select from the Source table field the table that relates to the mobile event type you selected.
   Note:

   If you select OnLogin as the Type, the source table is Mobile app config [sys_sg_native_client].

   If you select OnButtonClick as the Type, the source table is Function [sys_sg_button].

8. Select New in the Event Action area, to define what happens when an event is triggered.
9. Complete the following fields as needed, to create conditions in the event action form, for showing or not showing a mobile pop-up.

   Table 2. Mobile event action form

   Field	Description
   Properties
   Name	The name for your mobile event action.
   Settings
   Type	The type of event action. Select ShowPopup.
   Condition type	The conditions applied to this mobile event action. Declarative: Adds a condition builder to the form. For more information, see condition builder. Script: Adds a script condition field to the form.
   Query condition script	Use scripts to determine the records to be returned. Note: This field only displays when you choose Script in the Condition Type field
   Table	The table that contains the records to be returned. Note: This field only displays when you choose Declarative in the Condition Type field.
   Condition	Set conditions to determine what records are returned from the selected table. If a condition isn’t set, the query returns all records. Note: This field only displays when you choose Declarative in the Condition Type field.
   Popups	Select the mobile pop-up to use and how it displays.

10. Select ShowPopup in the Type field.
11. Select either Declarative or Scripted in the Condition type field.
    Different fields display when you select either Declarative or Scripted conditions that apply to this mobile event.
12. Select New in the Popups field, to determine what the mobile pop-up looks like.
13. Complete the following fields as needed.

    Table 3. Mobile pop-up form

    Field	Description
    Properties
    Name	The name of the mobile pop-up.
    Tap outside to close	Option to tap on your mobile screen outside of the pop-up area, to close the mobile pop-up. Note: If this option isn't selected, your pop-up card must contain a button to close the pop-up. Otherwise, this setting is ignored.
    Blur background	Option to blur the background of your mobile screen. This option gives more emphasis to the pop-up.
    Active	Whether the mobile event is activated.
    Card	The card to be used for the pop-up.

14. Select either Choose to use an existing card or select New to create one from the Card field.
    For more information about creating cards, see Mobile Card Builder.

    Note:

    Two mobile pop-up card templates are provided with the base system. These templates are called Pop-up 01 and Pop-up 02.
15. Optional: Assign configurable functions or predefined functions to a button on a mobile pop-up card.
    Note:

    For more information about configurable functions, see Mobile functions and Configure a card action using Mobile Card Builder. Also, see the What to do next section in this topic.
16. Select Save.

What to do next

You can add two types of functions to a button on a mobile pop-up card, configurable functions and predefined functions. Configurable functions enable developers to customize function behavior and functionality. Predefined functions have dedicated functionality, purpose built for mobile pop-ups. The following predefined functions are available:

• Cancel: Dismisses the pop-up without performing any additional action.
• Continue: Submits or proceeds with the original function from which the pop-up was triggered.
• Logout: Logs out the user from the current instance and is navigated to the instance list page.

For more information, see Mobile functions and Configure a card action using Mobile Card Builder.

• Assign predefined functions to mobile pop-ups
  Use predefined functions within mobile pop-ups to perform actions like dismiss the pop-up, proceed with the suggested instruction, or log out of the instance.