Jane Marple wants to give supervisors the opportunity to approve ideas on the way. The approval step therefore has to contain a mobile form. You are going to model this form now.

Open the element Mobile Form Idea Check.

The mobile form contains a predefined area including the following elements:

  • the explanatory text Main Area
  • the explanatory text Enter your text here
  • the input field Text Element
  • the explanatory text Fields marked with * are mandatory
  • the navigation element containing the preconfigured buttons Save, Cancel and Next

At the right side of the workspace you find the New Elements sidebar. Use it to drag and drop additional form elements onto the workspace.

The elements are classified in four categories:

  • General
  • App-specific
  • Mobile Elements
  • Complex

Click on the category name to display the associated elements.

If you want to delete a form element, right-click on it.

Select option Delete in the context menu.

Click on an element to activate it. The active element is marked by a red frame.

In the Edit Sidebar on the right side of the workspace you can then change the settings of the active element, for example rename the element or define additional field properties.

  • Rename the existing input field Text Element in Name.
  • Change the Field Name in Container to Name.
  • Activate the option Read Only.

Use the explanatory text element Main Area as header and enter an appropriate text, for example Submitted Idea.

Now add all form fields you are using in the first form Idea:

  • Drop-down field Department (add the same values in the Possible Values editor as you used in the responsive form)
  • Date Picker Creation Date
  • Text Area: Description

Use the same Field Names in Container for all fields as in the responsive form.

Activate the Read Only option for all fields.

  • Add another Explanatory Text element as header for the Approval section.
  • Add a Radio Button element and configure it as follows:
    • Name: Approval
    • Field Name in Container: Approval
    • Mandatory
  • Click on the gear wheel of the option Possible values.

An editors opens where you can insert the possible values of the radio button.

Keep the default settings Yes and No.

At least rename the button Next.

Use an appropriate description such as Submit Decision.

Switch to the sidebar Form Properties and open the category Design Templates.

Choose one of the templates.

Use the Play button to execute your model.

If you use the preview function in the Forms Editor, only the current form is displayed.

The form preview is displayed in a pop-up window.

The icons at the top of the screen allow you to switch between the different views:

  • Mobile phone (upright)
  • Mobile phone (landscape)
  • Tablet (upright)
  • Tablet (landscape)

Try different views, then close the window.

You have finished designing your forms.

Before you can execute your app, you have to configure the overview. To do so, switch back to the content of the app project.

Step 5: Configuring the Overviews
Step 5: Configuring the Overviews
Related Documentation:

  • No labels