---
title: "Basic Information Questionnaire Snippet"
slug: "basic-information-questionnaire-snippet"
updated: 2025-09-26T17:18:47Z
published: 2025-09-26T17:18:47Z
canonical: "docs.unqork.io/basic-information-questionnaire-snippet"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Basic Information Questionnaire Snippet

## Overview

The **Basic Information Questionnaire** **snippet** provides a set of [components](/v1/docs/module-builder-component-library) designed to collect PII (personal identifiable information) from an end-user. Due to the sensitivity of PII, it is important to follow [Security Best Practices](/v1/docs/best-practicessecurity) when collecting information. The [Basic Information Questionnaire snippet](https://marketplace.unqork.io/app/marketplace#/display/listing?id=60199146a68c25026703076a) is available in the [Marketplace](/v1/docs/introduction-to-the-unqork-marketplace) and can be added to any environment.

Here's how the snippet looks in Express View:

[Video](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic_info_expressview.webm?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)

And here's how the snippet looks in the Module Builder:

[Video](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic_info_snippet_add.webm?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)

## How the Snippet Works

The Basic Information Questionnaire [snippet](/v1/docs/introduction-to-snippets) works by collecting data using the components listed below:

- 5 [Text Field components](/v1/docs/text-field-component)
- 3 [HTML components](/v1/docs/html-element-component)
- 1 [Date Input component](/v1/docs/date-input-component)
- 1 [Radio Buttons component](/v1/docs/radio-buttons-component)
- 1 [Email component](/v1/docs/email-component)
- 1 [Address Search component](/v1/docs/address-search-component)
- 2 [Number components](/v1/docs/number-component)

## Customizing the Snippet

There are a few ways you could customize the Basic Information Questionnaire snippet. You can set fields as required, so the end-user must complete a field before moving forward. You may want to add a [Button component](/v1/docs/button-component) that saves the end-user's data in the database. You could add extra information fields to your snippet or change the order of the components. Perhaps some of the fields don't fit your needs, and you'd rather hide a few components. The beauty of snippets is that you can use them as a foundation. From there, you're free to customize and build whatever you want.

### Making a Field Required

Set a component to require end-users to complete it. If end-users don't fill out the component's field, they cannot progress to the next module.

To make a component required:

1. Hover over the component.

A 5-button toolbar appears above the component on hover-over.
2. Click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Settings(19).jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) (**Settings**) button to open the Configuration window.
3. From the side navigation panel, select ![Validation Icon](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/validation_configure_window_icon.png?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) **Validation**.
4. Under **User Input**, set **Required** to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) **(ON)**.

[![A static image displaying a Text Field configuration window's Validation panel. The User Input section is toggled to ON.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic_info_validation_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic%20info%20validation.jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)
5. Click **Save & Close**.
6. **Save** your module.

Now, the end-user must complete the required fields before they can navigate further.

### Adding a Component

To collect more data from an end-user, add extra data collection components. To add a component:

1. In the left sidebar of the Module Builder, search for the component you want to add.
2. Drag and drop the component onto your canvas.
3. Set the Property ID and **Label Text** for your component.
4. Click **Save & Close**.
5. **Save** your module.

### Changing the Order of Your Components

Change the order or location of your components in a module:

1. Hover over the component.

A 5-button toolbar appears above the component on hover-over.
2. Click and drag the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Move(3).jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) (**Move**) button, dropping the component when it's in position.
3. **Save** your module.

### Hiding Unused Components

If the snippet has fields you don't need now but may want to use in the future.Use the Hide Field setting.

1. Hover over the component you want to hide.

A 5-button toolbar appears above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Settings(19).jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) (**Settings**) button.
3. Under the ![Display Configuration Window Icon](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/display_configure_window_icon.png?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) Display panel, set the **Hide Field** toggle to ![A toggle switch indicating an on/off state for a user interface element.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Group 1.png?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) (ON).
4. Click **Save & Close**.
5. **Save** your module.

### Removing a Component

Is there is an entry field you want to delete from your snippet? To remove the corresponding component:

1. Hover over the component you wish to remove.

A 5-button toolbar appears above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Remove(8).jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) (**Remove**) button.
3. **Save** your module.

### Adding a Button Component to Save Submission Data

The Button component saves submission data to the database. Submissions tie to your module's unique ID. You can access these submissions at any time or even create a dashboard to organize end-user data.

1. Drag and drop a **![Button Icon](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/button_component_icon(16).png?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D) Button** component onto your canvas, placing it at the bottom of panelBasicInfo.
2. In the Property ID field, enter **btnSave**.
3. In the **Label Text** field, enter Save.

[![A static image displaying a Button component configuration window. The Property ID is set to btnSave, and the Label Text field is set to "Save".](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic_info_btn_example_thumb_0_0.jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/basic%20info%20btn%20example.jpg?sv=2026-02-06&spr=https&st=2026-11-08T18%3A01%3A16Z&se=2026-11-08T19%3A01%3A16Z&sr=c&sp=r&sig=tpAC8iPinaGdPgQD4kUffPzkiOlk%2FsmGx9LX%2BHUBtKU%3D)
4. Click **Save & Close**.
5. **Save** your module.

Now, when your end-user accesses your module in Express View, they can press a Save button. The button creates and saves a submission of the information they entered.

## Resources

- [Add or remove a snippet.](/v1/docs/adding-and-removing-snippets-in-your-module)
- [Learn how to set up an Unqork application in 20 minutes](/v1/docs/how-to-set-up-an-unqork-application-in-20-minutes).
- [Discover more about module components](/v1/docs/module-builder-component-library).
- [Understand submission data](/v1/docs/submission-data).
- [View training courses at the Unqork Academy](https://academy.unqork.com/).

Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View.

A Property ID is the unique field ID used by Unqork to track and link components in your module.