Customizing Mobile Popup Windows

You can create a custom mobile page and set it up as a popup window. Popup windows enable you to display messages, such as warnings and errors, without transferring to another mobile page. You can also use them to perform additional actions, aside from those included in the main process flow.

Within a custom mobile process, you can choose the page from which you want to display the popup window. On the mobile page, you can set up a popup window to appear through either of the following ways:

• An action done on a page element like a button click

  For example, the Add Carton popup window appears when you try to pack an item before you add a pack carton.

• A call on, before, or after an action occurs, such as a page or page element load

  For example, the Add Carton popup window can appear immediately after the Pack Items Into Cartons page is loaded.

For both options, you must set up a Forward Form action that points to the popup window as the target page.

Other customizations for your popup window may include adding elements to capture data, submitting data, or navigating to a page or another popup window. Note that any validations on the page that displays the popup window are still triggered during a popup window navigation or submission. If a validation error occurs on the page, the popup window action cannot be completed.

To customize mobile popup windows:

1. Access your custom mobile process by doing the following:

   1. Using the Administrator role, go to Setup > Custom > Mobile - Applications.

   2. On the Mobile - Applications List page, click View next to the mobile app.

   3. On the Mobile - Process List page, click View next to the custom mobile process that contains the popup window.

2. On the Mobile - Process page, on the Pages subtab, do one of the following:

   • To create a popup window, click New Mobile - Page.

   • To modify an existing popup window, click Edit next to its name.

   The Mobile - Page page appears.

3. Enter or edit details in the following fields:

   1. Name – Enter a unique name for the popup window.

   2. Title – Enter the title, which appears on the mobile app.

   3. Type – Select the type of mobile page, which is usually the Process type.

   4. Is Pop Up – Check this box.

      When you check this box, the On Popup Close Action field appears. To set up the On Popup Close Action field, see step 5. If you clear this box, you also clear the field.

   5. (Optional) To set up the On Load or After Load actions, see Customizing Mobile Actions.

4. Add or edit page elements on your popup window.

   You can add a Dynamic Text element that displays a message on the popup window. To implement navigation on the popup window, you can add button elements such as the following:

   • You can add a button or other element that closes the popup window. Then, you can set up the On Close Popup Action to set up an additional action, such as data validation, that runs when you close the window. See step 5.

   • If you want to set up multiple popup windows that appear in sequence, you can add a button on each popup window. You can also add the Back button element to return to a previous popup window.

   For instructions, see Customizing Mobile Page Elements.

5. To set up page navigation and data submission in the On Close Popup Action field, see Navigation and Data Submission for Mobile Popup Windows.

6. To set up the mobile page that displays your popup window, see Displaying a Popup Window from a Mobile Page.

7. Click Save.

8. To apply your updates to the mobile app, see Compiling Mobile Customizations.

Navigation and Data Submission for Mobile Popup Windows

You can set up a mobile action that is called when you close a popup window. You can assign an action that validates data in the popup window fields and saves them to a NetSuite record. Depending on your business requirements, you can also include navigation to another page or popup window.

On the Mobile - Page page for the popup window, in the On Popup Close Action field, you can choose an existing action or create a new one.

Note:

The On Popup Close Action does not apply to the X button, which is a default button on popup windows. This button closes the popup window to return the focus back to the mobile page.

If you want to create or edit a mobile action, on the Mobile - Action page, set values in the following fields:

1. Name – Enter a unique name for the mobile action.

2. Type – Select one of the following types of mobile actions:

   • Forward Form – Use this action type to redirect to the mobile page that displays the popup window.

   • Submit Form – Set up this action type to submit data from the popup window, before you are redirected to a target page.

   • Action Sequence – Set up this action type if you want to assign different actions to multiple buttons on your popup window. You can set up a different target page for each action that you assign to a button or other element.

3. Depending on the mobile action type, you can set up the other fields, such as those for the RESTlets that validate or submit data.

   For more information, see Mobile Actions for Page Validation and Navigation or Mobile Action Sequence.

4. Depending on your popup window requirements, you can add input and output parameters. For the Forward Form action type, you must set up an input parameter for the target page, which is the page that displays the popup window.

   To add a parameter, on the Input Parameter subtab, click New Mobile - Input Parameter. On the Mobile - Input Parameter page, set values in the following fields:

   • Name – Enter a unique name for the input parameter.

   • Key – To set up a target page, enter page_id, the default key in the state that stores the name of a mobile page

     Tip:

     If you set up a RESTlet, you can add input and output parameters that handle the transfer of data. See step 3.

   • Value - Enter the keyword, constant:custom_page_, followed by the name of the target mobile page.

     For example, if the name of the mobile page is pagename_abc, enter constant:custom_page_pagename_abc.

   • (Optional) You can use the Condition and Resolution fields to set up conditional page navigation.

     You can use a condition to set up navigation either to the mobile page or another popup window.

   Repeat this step to add more parameters to the mobile action. For more information about mobile actions, see Customizing Mobile Actions.

5. Click Save.

To continue your popup window setup, see Customizing Mobile Popup Windows.

Displaying a Popup Window from a Mobile Page

From a mobile page, choose the element, usually a button, that displays the popup window. Alternatively, you can set it up in the On Load or After Load Action of the page. Then, set up a Forward Form action by following the instructions in this procedure.

To display a popup window from a mobile page:

1. Access the Mobile - Page page that contains the page element or load action.

   1. Using the Administrator role, go to Setup > Custom > Mobile - Applications.

   2. On the Mobile - Applications List page, click View next to the mobile app.

   3. On the Mobile - Process List page, click View next to the custom mobile process that contains the popup window.

   4. On the Mobile - Process page, on the Pages subtab, do one of the following:

      • To create a new page, click New Mobile - Page.

      • To modify an existing page, click Edit next to its name.

      The Mobile - Page page appears.

2. Depending on how you want to display the popup window, do one of the following:

   • Next to the On Load Action or After Load Action field, select the Forward Form action that displays the popup window.

   • On the Page Elements subtab, click Edit next to the page element. Then, on the Mobile - Page Element page, next to the action field, select the Forward Form action that displays the popup window. For button elements, you can set it up in the On Click Action field.

   Alternatively, if you want to edit an existing Forward Form action, click the open icon. To create a mobile action, click the plus icon.

3. On the Mobile - Action page, enter or select values in the following fields:

   • Name - For a new action, enter a unique name for the Forward Form action.

   • Type - Select Forward Form.

   • (Optional) Set the other Forward Form action fields.

     See Customizing Mobile Actions.

4. For a new action, click Save, and then edit the saved action to set up its input parameter.

5. On the Input Parameters subtab, click New Mobile - Input Parameter to add a parameter or click Edit next to an existing one.

6. On the Mobile - Input Parameter page, enter values in the following fields:

   • Name - For new parameters, enter a unique name for the input parameter.

   • Key - Enter page_id, the key in the state that stores the name of a mobile page or popup window.

   • Value - Enter the keyword, constant:custom_page_, followed by the name of the mobile page that you have set up as a popup window.

     For example, if the name of your popup window is popupwindow_123, enter constant:custom_page_popupwindow_123.

7. Click Save.

To continue your popup window setup, see Customizing Mobile Popup Windows.

Related Topics

SCM Mobile App Customization

Customizing Mobile Processes

Customizing Mobile Pages

Customizing Mobile Page Elements

Customizing Mobile Actions

SCM Mobile App Access

SCM Mobile App Basics

SCM Mobile Setup

General Notices