Picture of Utilising predefined text in your fields (Form Builder) | FB_025

Utilising predefined text in your fields (Form Builder) | FB_025

In this tutorial, we will learn how to create predefined text options in the Infigo Form Builder. The end result will be a dropdown list appearing in the main form, from which a user can select between available options. Selecting an option will subsequently populate the linked field on the form. This example will focus on the simplest option, where you manually specify several options to choose from. This option is best in instances where only a small number of options are available.

Tutorial Video Transcript

A transcript of our tutorial video, ensuring you can find exactly what you need, when you need it.

You can search this page to find the relevant time-stamp in the video. Also, this text can be used as part of the tutorial search feature.

00:00:05:15 - 00:00:07:13
In this
tutorial, we'll learn how to create

00:00:07:13 - 00:00:10:18
predefined text options
in the Infigo form builder.

00:00:11:08 - 00:00:14:12
The end result will be a drop down list
appearing on the main form

00:00:15:21 - 00:00:17:19
from which the user can select between

00:00:17:19 - 00:00:20:19
available options.

00:00:21:18 - 00:00:24:02
Selecting
that option will subsequently populate

00:00:24:02 - 00:00:27:02
the linked fields
on the actual canvas itself.

00:00:29:00 - 00:00:31:18
This example will focus
on the simplest option

00:00:31:18 - 00:00:34:27
where you manually specify
several options to choose from.

00:00:35:15 - 00:00:39:05
This option is best in instances
where only a small number of options

00:00:39:05 - 00:00:42:05
are available within the dropdown list.

00:00:49:03 - 00:00:50:07
We begin to specify

00:00:50:07 - 00:00:54:08
this functionality by navigating
to the MegaEdit settings of the product

00:00:54:08 - 00:00:57:08
in question.

00:01:01:11 - 00:01:01:25
Locate

00:01:01:25 - 00:01:05:23
the Form Builder script,
and then click on its config settings.

00:01:05:23 - 00:01:07:06
Do note that you can always apply

00:01:07:06 - 00:01:10:23
these settings on the global config level
if it's preferable to you.

00:01:14:02 - 00:01:14:24
So here we have an

00:01:14:24 - 00:01:18:14
example of a predefined dropdown
within the script config.

00:01:18:25 - 00:01:23:20
As a reminder, this is for the manual
specification of a short list of options.

00:01:24:00 - 00:01:27:24
There are other options available
for more advanced or numerous options

00:01:28:01 - 00:01:31:01
which are covered in other tutorials.

00:01:33:19 - 00:01:36:19
So let's go through
some of the entries in here.

00:01:36:24 - 00:01:38:29
The custom target tag

00:01:38:29 - 00:01:43:07
line allows you to apply a name
to the predefined text entry,

00:01:43:15 - 00:01:46:18
and this is used later for identification
purposes.

00:01:51:29 - 00:01:54:10
Each option within your dropdown
should be placed

00:01:54:10 - 00:01:57:22
within this options
section of your config.

00:02:00:04 - 00:02:01:06
This option section

00:02:01:06 - 00:02:04:06
should also contain a title

00:02:04:16 - 00:02:07:18
and a value for each of the options
you want to input.

00:02:09:15 - 00:02:10:18
The title is a text

00:02:10:18 - 00:02:14:18
that will appear in the forms
dropdown field and the value is the text

00:02:14:18 - 00:02:18:10
that will be populated
on the linked field on the canvas itself.

00:02:24:13 - 00:02:27:01
Do keep note of the kind of formatting
that you'll need in order

00:02:27:01 - 00:02:28:04
to make this work.

00:02:28:04 - 00:02:30:15
And do remember
there are tools available on the internet

00:02:30:15 - 00:02:33:21
which will help you
with the formatting of conflict like this.

00:02:33:22 - 00:02:36:22
My personal preference
is just to ask ChatGPT

00:02:37:04 - 00:02:40:04
to check this format.

00:02:41:00 - 00:02:43:14
Once you've input those options,
click on Save and continue.

00:02:43:14 - 00:02:46:14
Edit.

00:02:46:20 - 00:02:49:06
Next, we need to configure the Infigo
form builder

00:02:49:06 - 00:02:52:28
to recognize this field
as a predefined text field.

00:02:53:28 - 00:02:56:28
I'm just going to go back to my product

00:03:00:20 - 00:03:02:27
and navigate to the custom tab

00:03:02:27 - 00:03:05:27
and the advanced
settings of the field in question.

00:03:11:05 - 00:03:14:00
What we need to do is to make sure
that we have predefined

00:03:14:00 - 00:03:17:24
text selected
from the available list of field types,

00:03:19:25 - 00:03:23:24
and then we select the predefined options
that we want to make available.

00:03:23:27 - 00:03:26:14
Within this particular form entry.

00:03:26:14 - 00:03:30:06
So you will be presented with a list
of all of the predefined text sections

00:03:30:06 - 00:03:32:04
that you've defined
within your script config.

00:03:33:07 - 00:03:34:04
So in this particular

00:03:34:04 - 00:03:37:08
example,
I've given it the name CountryPredef.

00:03:38:10 - 00:03:41:26
If I go back to my config, you can see
that was the custom target name

00:03:42:06 - 00:03:45:06
I gave to that particular section.

00:03:50:27 - 00:03:51:13
If you click

00:03:51:13 - 00:03:54:20
the option on, they will become available
as a selection.

00:03:54:20 - 00:03:57:20
Your dropdown list.

00:04:00:14 - 00:04:01:21
We then just need to confirm

00:04:01:21 - 00:04:04:29
whether this is a single or a multi line
text input.

00:04:11:27 - 00:04:13:28
With this completes,
your populated dropdown

00:04:13:28 - 00:04:17:14
list will appear on the customer
facing form and is now available

00:04:17:14 - 00:04:20:14
for use.

00:04:24:04 - 00:04:24:21
Do remember

00:04:24:21 - 00:04:28:01
to save your product
in order to keep these changes.

 

Incomplete
Step by Step Guide

Utilising predefined text in your fields (Form Builder) | FB_025

In this tutorial, we will learn how to create predefined text options in the Infigo Form Builder. The end result will be a dropdown list appearing in the main form, from which a user can select between available options. Selecting an option will subsequently populate the linked field on the form.

This example will focus on the simplest option, where you manually specify several options to choose from. This option is best in instances where only a small number of options are available.

Creation Date: Feb 13, 2024
Created By: Sam Webster

1. This is an example of our end result. A drop down list in the form which subsequently changes the value populated on the field

This is an example of our end result. A drop down list in the form which subsequently changes the value populated on the field

2. We begin to specify this functionality be navigating to the MegaEdit settings of the product in question

We begin to specify this functionality be navigating to the MegaEdit settings of the product in question

3. Locate the Form Builder script on this product and click Config

Note, you can also apply these changes on the global config level if it is preferable

Locate the Form Builder script on this product and click Config

4. Here we have example of a predefined dropdown within the script config

As a reminder, this is for the manual specification of a short list. There are other options available for more advanced or numerous options, which are covered in other tutorials.

Here we have  example of a predefined dropdown within the script config

5. The customTargetTag line allows you to apply a name to the predefined text entry, used for identification purposes, later.

The customTargetTag line allows you to apply a name to the predefined text entry, used for identification purposes, later.

6. Each option in your dropdown should be placed within the "options" section of the predefined text config. These should also contain a title and a value

The "title" is the text that will appear in the form's dropdown field.

The "value" is the text that will be populated on the linked field on the form itself

Each option in your dropdown should be placed within the "options" section of the predefined text config. These should also contain a title and a value

7. When you have populated all options, click on Save and Continue Edit

When you have populated all options, click on Save and Continue Edit

8. Relaunch the MegaEdit product and navigate to the field's advanced settings in the Custom Tab

Next, we will configure the Infigo Form Builder to recognise this field as a predefined text field.

Relaunch the MegaEdit product and navigate to the field's advanced settings in the Custom Tab

9. Select Predefined text from the list of field types

Select Predefined text from the list of field types

10. Select the predefined text option you wish to utilise in this field

You will be presented with a list of all the predefined text sections you have defined within your script config.

Select the predefined text option you wish to utilise in this field

11. Confirm whether this is to be a single or a multiline text input

Confirm whether this is to be a single or a multiline text input

12. With this complete, your populated dropdown list will appear in the customer facing form and is available for use

With this complete, your populated dropdown list will appear in the customer facing form and is available for use

13. Remember to save your product!

Remember to save your product!

Individual Search Words:

dropdown, menu, options, list, predefined, selection, populate, text, field, manual

Alternate Search Phrases:

create dropdown menu, predefined options list, manual text selection, user selection field, dropdown text options, specify options in form, populate field from dropdown, selection list for form, form text dropdown, predefined list of options