Form Creation
Last updated
Was this helpful?
Last updated
Was this helpful?
Creating a Form is as simple as the click of a button. From the main Portal page, select or create a Project. Inside your project, click the Forms button on the left-hand sidebar. Next, click the green +New Form button. From here you will be prompted to select what type of form you would like to create, Web Form or PDF. Once a form type has been selected you will be in the context of the Form Builder. Give the form a name, add some components, and build away!
Enter a title for your Form. This will help you identify it later.
The Form Name is utilized when embedding the Form into your application.
The API Path is the endpoint for accessing the Form and Form submissions. The API path name, like the Form name, will auto-populate based on the Title but can also be changed independently.
Drag and Drop Form components onto your Form. See Form Components for more information on the types of components and how to configure them.
Forms can be edited from the Project home page. Get to this page by clicking on the Project name from the User Portal.
In the list of forms, click the Edit button to start editing a form.
When you are done editing, click the Save button.
Forms can be deleted from the Form landing page by clicking on the trash icon next to the form. You will be prompted to confirm the form deletion.
All forms are soft-deleted, meaning you can easily restore them from your Database. To restore a deleted form, search for the form using the form's title or ID within your database and change the deleted flag to a timestamp. The form should be restored to your project after the database updates.
There are many situations where you would like to copy an existing form into a new form within your project, or between projects. There are several avenues for copying a Form:
Copy Form Button: While in Edit Mode for a mode, at the bottom of the builder is a Copy Form button. Clicking this button will copy the Forms JSON and create a new form with the same components and settings.
This is the quickest and easiest way to copy a form within the same project context.
This is the quickest and easiest way to copy forms between projects.
Command Line Interface:
If your environment is preventing you from using one of the options listed above, due to CORS restriction and security reasons, you can utilize Form.io's CLI.
First, install the command line using the following command in your command prompt.
Once you have the command line installed, you will then need to create the form which will serve as the destination form. You do not need to add any components to this form, but just keep it blank since the copy command will populate the destination forms components. Once you have the destination form created, you will then use the formio copy form command to copy your forms using the following syntax.
As an example, the following command will copy a form within the project.
This is the machine name for your Form. It can only contain alphanumeric characters and will automatically populate from the title you enter in . Form Names can be independently changed if you do not wish to carry the Title.
Use the search bar to search for a form title within your project. Click the Filter Tag to filter your forms based on saved to the Form. Filter by Tag is available in formio-enterprise version 8.5.0 and later.
When using one of the Copy methods, Actions saved to the form are not copied. Use the method to export the form JSON (including the actions) and then importing to your desired stage or project
Form Embed URL: When a form is created, the form Embed URL is the endpoint where the Form's JSON Schema is stored. Copy the Form Embed URL and click the Import Form. Paste the embed URL and click the Import Form button. Ensure the copied form has the Read Form Definition set to Anonymous before trying to import.
