Use dynamic data in a form

Fetch data from tools like Airtable, Notion or any service with an API. Display dynamic content in your form and use it to hide, validate and pre-fill fields.

Get the data you need

To display dynamic data, you first need to get the data from Airtable, Notion or another source into your form. There are several options for doing this, depending on your use case:

Use a login page. A login page will automatically give you access to the entire user record who logs in.

Use URL parameters to pass any arbitrary information to your form, e.g. from Stacker, Softr, or other portals.

Use a "record picker" question type. You'll then be able to access any field in the record that is chosen. Note that you can also pre-fill record pickers.

4. Use the "Pre-fetch records" feature to fetch information from Airtable or Notion before your form loads.

Reference the data in your form

In Fillout, you can display data almost anywhere: in labels for questions, in alerts, in logic for hiding or validating questions, and more. In this example, we'll use a "Text" question type, which lets us display uneditable, formatted text.

First, add a "heading" question type to your form. In this example, we have a record picker ("Choose a manufacturer") that we want to display more information from.

2. Type "@" in the heading field (in the center of the form), to open a menu for picking references to previous form inputs. In the reference picker, navigate to the field you want to display and select it.

3. That's it! The blue bubbles in the center indicate the fields we are referencing. This text will now automatically change whenever you pick a new value in the record picker. Test your form in preview or live mode to see it in action!

Other places to reference data

You can also reference the result of the integration step in "show", "hide" and validation conditions to customize your form and prevent input errors.

For example, show a warning when a field is missing in a record:

Reference data in the "default value" to pre-fill fields (more info here)