Form View Pro
Describes the Form.io FormView application
Last updated
Describes the Form.io FormView application
Last updated
The FormView Pro application allows form users to consume and submit forms built and published within the Form.io platform. This removes the need for form builders to develop a host application or integrate the forms into an existing application.
The Form View Pro application is the host application used through the Launch feature, where a form created in the Developer Portal can be "launched" so that end users can submit the form and manage their submissions.
A form hosted through this application will be found at the URL https://pro.formview.io after it is launched, as seen below:
For more information on the Launch Form feature, check out the documentation on Launching a Form.
While this application is designed to be light-weight and minimal, the Form View Pro application supports many features that can be used for a wide range of cases, including full business process workflows. Considering that a "form" can be dynamic and multi-paged (using the wizard feature), it becomes clear that the simple use case of rendering a form can achieve a lot of functionality. For example, this application is perfect for the following use cases:
Student Enrollment and Onboarding
Employment Applications
Quick Surveys
Patient Registration
Conference Registration
Loan Applications
and the list goes on and on
Certain features are not suitable candidates to be served through the Form View Pro application. Forms that rely on external authentication (SAML, OIDC, etc.) or two-factor authentication (2FA) may create additional development challenges beyond the scope of Form.io Documentation and outside the ability of Form.io Email Support to resolve.
The term "hosted form" is used to describe any form that is hosted on the Form.io SaaS product, the Develeoper Portal found at https://portal.form.io. This is the place form builders create an account with Form.io, as well as create a project that is "hosted" by Form.io. Forms that are "launched" from the hosted platform will always use the Form View Prop application at https://pro.formview.io.
Review the documentation on Launching a Form to see a walkthrough on how this works.
Once a form has been launched, it will use URL parameters to determine which form is being viewed, in the following format:
An example URL, loading a form called Example Form in a project called Example Project, would appear as follows:
Because of this, any hosted form within the Form.io SaaS platform can be hosted and displayed to form users.
Configurations are provided to the Form View Pro application using Query parameters. For example, tell the application to use a different theme by providing the following:
This switches the theme that is used to render the Form View application like so:
Form View Pro can also be configured using a project's Public Configurations. This provides an interface where each project can provide public configurations that are used to control the behavior of their applications, but it can also be used as the configuration mechanism for the Form View Pro application. To change the Form View Pro configurations:
Open the project on the Form.io Devleoper Portal as a user with sufficient privileges.
Click the Settings option on the left-hand menu.
Navigate to the Public Configurations of the project as follows.
theme
Changes the theme of the rendered form. The names that can be used coincide with the Bootswatch themes found @ https://bootswatch.com/. Clicking on the "Themes" link on this page will show all the different themes that are available.
css
Add a custom CSS file url to apply to the form. Must be a hosted CSS file.
js
Add a custom JS file url to apply to the form. Must be a hosted JS file.
reset
Resets all "cache" from previous form sessions. Useful to send as a URL to a user that will ensure they are not affected by cache.
src
A custom Form URL. You would use this instead of using the #/{PROJECT_NAME}/{FORM_NAME} in the url.
return
A URL to navigate to once the form has been submitted.
header
To hide or show the header. header=0 will hide the header.
iframe
To place this viewer in "iframe" mode where it removes all padding and headers.
host
Force the API Host for the form that is being rendered. Useful if you wish to render a form from a different deployment.
protocol
Force the URL protocol for the host. (https or http)
token
Force an Auth Token (JWT) to be used for this form submission. Used when sending an email that automatically logs into the application.
sso
Provides an SSO authentication into the FormView application. Can be "saml" or "okta"
saml
Same as "sso" but uses "saml" by default.
branding
With any Enterprise Subscription, remove the Form.io logo from FormviewPro by setting to "false"
Click the Launch tab in the form header to configure settings that will affect the form in the FormView Pro application as well as launching the form within the applicaiton.
Configure these settings to modify how the form is displayed and behaves within the FormView Pro application.
Choose a Bootstrap theme to display the form in the FormView Pro application
Show Header
Check this setting to display the Form Name, Login Button, and any Logos added using Public Configurations within the Formview Pro application header.
Enable Thank You Page Editor
Check this setting to enable a WYSIWYG editor located at the bottom of the page. The content within this editor will display for the end-user after submitting the form within the FormView Pro application.
Click this button to launch the Form within the FormView Pro applicaiton
Click this button to enable/disable Anonymous submissions which allows unauthenticated users to submit the form within the application.
This setting will add or remove the Anonymous Role to the Create Own Permission within the Access settings of the form.
Read More About These Permissions Here
The Form View Pro application uses the exact same method for User authentication as the Form Manager application. Review the Form Manager Authentication documentation to get an idea how to authenticate within the Form View Pro application.
Once logged into the application, it is also possible to view the Submissions of a form. This can be done by clicking on the Submissions link at the top of the screen.
This page provides a list of all the submissions of this form visible to the logged-in user. If authenticated as an Administrator, all submissions should be visbile; if logged in as a User, only submissions created by that user will be seen. This could change based on the Access settings configured on the form.
The fields shown in the columns of the Submission View can be controlled by configuring each field within the form and checking or unchecking the Table View flag.
Unchecking this field will then remove the field from the submission view which will enable this view to be customized based on which fields you would like to show when viewing submissions.
Every deployed environment receives has a unique Form View Pro application provisioned to it, used to launch forms within that environment. The URL of the Form View Pro application within any deployed environment can be found at the following URL:
Where yourserver.com and yourproject are the names of the domain and project respectively. For Developer Portal deployments, it is also possible to get to the Deployed Form View Pro application using formio as the project name.
