Basic Information Questionnaire Snippet

Estimated Reading Time:  4 minutes

Overview

The Basic Information Questionnaire snippet provides a set of components 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 when collecting information. The Basic Information Questionnaire snippet is available in the Marketplace and can be added to any environment.

Here's how the snippet looks in Express View Express View is how your end-user views you 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.:

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

How the Snippet Works

The Basic Information Questionnaire snippet works by collecting data using the components listed below:

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 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 (Settings) button to open the Configuration window.
3. From the side navigation panel, select Validation Icon Validation.
4. Under User Input, set Required to Toggle On (ON).

A static image displaying a Text Field configuration window's Validation panel. The User Input section is toggled to ON.

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 A Property ID is the unique field ID used by Unqork to track and link components in your module. 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 (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 (Settings) button.
3. Under the Display Configuration Window Icon Display panel, set the Hide Field toggle to Toggle On (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 (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 Button component onto your canvas, placing it at the bottom of panelBasicInfo.
2. In the Property ID A Property ID is the unique field ID used by Unqork to track and link components in your module. 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".

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