Add a form

A form is a data-driven configuration that collects data in Power Pages sites. Forms on pages are created from Dataverse table forms. Dataverse table forms can be created by using the Data workspace or from model-driven apps created in Power Apps. You can use them on pages or with lists to build a complete web application.

Tip

We've created a series of tutorials and videos for you to learn to use Power Pages and how create and add a form to a page. For more information, go to Tutorial: Add a form to a page.

To add a form:

  1. Open the design studio to edit the content and components of the site.

  2. Go to the Pages workspace.

  3. Select the page you want to edit.

  4. Select the section you want to add the form component to.

  5. Hover over any editable canvas area, then select the Form icon from the component panel.

    The add component menu options.

  6. You can choose either to create a new form or use an existing form (if a maker has created one previously).

    If you choose to create a new form, you'll need to enter the following criteria.

    Add a form to a page.

    Option Description
    Choose a table Choose the table where data will be stored.
    Select a form Select one of the Dataverse forms available for the selected table.
    Name your copy of the selected form Give your copy of the form a name.
    Data You can choose to have the data that's entered by a user create a new record, update existing records, or make the data read-only.
    On submit You can choose optionally to show a success message. You must enter the options to redirect to a webpage and redirect to a URL.
    CAPTCHA You can choose to show a captcha to anonymous users, authenticated users, or both.
    Attachments Allows you to enable and configure attachments for the form.

    Note

    You'll need to enable table permissions to ensure that users will be able to interact with the data on the forms.

  7. You can select the ellipsis (...) to duplicate the form, move it up or down within the section, or delete it.

Edit a text field on the form

You can edit text fields, including email, form title, and title section.

To edit a text field on the form:

  1. Hover and select the text field from the canvas.
  2. Edit the text field and style it as needed (bold, underline, or italic). Styling options for text fields including bold, underline, and italic.  Bold is selected here.

Edit and validate form fields

To edit a form field:

  1. Hover over and select the field from the canvas.
  2. Choose Edit field in the tool bar. The edit text field menu.
  3. From the Field Edit modal:
    • Update the field's label/display name.
    • Mark the field as required, then customize the error message to be shown when the field is required.
    • Add a description to the field and adjust its position (choices include above the field, below the field, and above the label).
    • Set the validation rules for the field.
      • Use the options to configure out-of-the-box validations.
      • Use the Regex option to enter custom validation using regular expressions.

Enable attachments on a form

Users can upload an attachment with form submission.

To enable attachments on a form:

  1. Add a form or edit an existing form.

  2. In the Add a form modal, choose Attachments from the left panel.

    • Configure the following options:

      • Turn on/off the Enable attachments toggle.
      • Turn on/off the Attachment is required toggle.
      • Turn on/off the Allow multiple files toggle.
      • Max file size allowed

        Note

        The following file types are allowed:

        • All
        • Audio
        • Document
        • Image
        • Video
        • Specific (comma separated values)

      Menu options for enabling attachments on a form.

Once configured, the file upload placeholder will show in the canvas.

Form with attachment option enabled.

Enabling table permissions

When you add a new form, you'll be prompted to set permissions to allow site users to interact with the form. The settings for table permissions will be pre-populated (create and append to), but you'll still need to assign web roles and save the settings. The process will automatically create the child table permissions for the note (annotations) table, which contain the attachments.

Configure table permissions.

You can also adjust the permissions and assign web roles based on your requirements in the Set up workspace.

Table permissions menu.

For more information, see Configuring table permissions.

Enable code components on form fields

If a Dataverse form field has been configured to use a code component using the Data workspace or a model-driven app, you can enable the code component to be used when a form is used on a webpage.

To enable the code component:

  1. Select the field and choose Edit field.

  2. Select Enable custom component field.

  3. Select OK.

    Enabling code component on webpage form.

The code component will now be available on the form.

See also