What is a Form Component?
The form is a common component to use in your app. With it, you can gather and store information from your users, providing them with a way to interact with the app. After the form is submitted, you can automatically send an email, or prompt the user to send an email, with a generic template including the forms fields.
You can either use the existing form templates available from our template gallery or create a new form from scratch.
How to Use a Form Component
Options of a Form Component
Click this button to open the list of available fields for use with a form (see the complete list below)
List of available text input fields for use with a form. The following options are common to all text input fields:
Text inputs – Number input
Text input field that allows numeric entry only. It includes all of the common options above plus
Text inputs – Password input
Text input field type that allows password entry. It includes all the common options above plus
Text inputs – Multiple line input
Text input field that allows multiple lines. It includes the common options listed above and:
Text inputs – Rich text
Text input field that allows styling the content with multiple lines of text. Styling will create HTML tags when stored in the data source. It includes the common options listed above and:
Multiple option fields to allow a user to select one or many options. The following fields are common to all multiple options:
Multiple options – Dropdown (single-select)
A single select option, the dropdown will hide value until a user clicks on it, taking up less space than radios.
Multiple options – Radios (single-select)
A single select option, radios will show each option on a separate line.
Multiple options – Checkboxes (multi-select)
A multi-select option, the checkbox will show each option on a separate line. Users can select any options.
File fields for use with a form. The following options are common to these fields:
Formatting fields that are not submitted, but used to style the form:
The buttons at the bottom of the form to submit or reset the form:
List of special fields for use with a form:
Default Value and Types
Some of our form fields allow you to set a default value to prefill and personalize the form. This option can be found for all text input fields, except for the password input field, and all multiple options fields. There are 4 different default value types to chose from:
Enter a value
The enter a value option will allow you to enter a specific value as the default input for the form field
User profile data
|Using the user profile data value type allows you to set a default input using the logged-in user’s profile data.|
For example, if you want the form to include an email address field, this can be prefilled using the logged-in user’s email address.
For this to work, the default key should be entered exactly as the name of the field which contains the user’s email address in the user information data source.
|App storage variable|
If a value is set using Fliplet.App.Storage then the key can be referenced and set as the form fields value
Link query parameter
|If you create a custom query on a page e.g. on a menu that links to a page with a form, then you can reference the value of that query parameter and set it as default the value in a form field|
Read only and cannot be edited
If you select this option the field will be visible to the user but not be able to be edited.
Settings – General
Textbox where the name of the form can be entered
Select a data source to store form submissions
Click to select or create a data source for form submissions. For more information, see the separate article on Data Sources.
Settings – Submission
Add new submissions to a data source
Check this box to add new form submissions to the data source. Once checked, the following fields appear:
Update existing entries in a data source
Check this box to allow the form to update existing entries in a data source. This requires users to have an Internet connection.
Load the data from a user’s profile
Check this box to load existing data from the data source for the signed-in user into the form. This requires users to log in to your app.
Send an email notification whenever the data is updated
This allows you to configure an email template when existing data is updated. For more information, see the Email Template article.
When the form is submitted, do you want to generate an email on the device?
Check this box to load a users’ email program and generate an email based on a configurable email template. For more information, see the Email Template article.
Settings – After the form has been submitted
Take the user to another screen
Select this to take the user to another screen after form submission. After selecting, the following fields appear:
Show a confirmation message
Selected by default, with an editable message template in HTML.
Set this form as a template
Check this box to set the form as a template that other users in your organization can reuse.
The name of the form template. This field appears after the’ Set this form as a template’ box is checked.
The description of the form template. This field appears after the ‘Set this form as a template’ box is checked.