Combining variables in the same text field (Form Builder) | FB_015

In this tutorial, we'll learn how to write your Form Builder script config for multiple variables.

We'll also take a look at how we can combine these variables to appear in the same text field on your canvas, as well as how to automate a line break between variables.

Update the Form Builder global config

We begin by navigating to our global config for the Form Builder script. Remember, we can create variables on a product by product basis if required, however creating them on a global level will ensure all products using the Form Builder script will have access.

Creating multiple variables is basically a repeat of the config for the first variable, however remember to add a "," at the end of your first variable config. This tells the system to move on to the next.

In this example variable, we are going to ensure that a line break is input as soon as we start typing into the field on the form. So here, for example, this will ensure that our Name and Title fields always appear on different lines, even if they are used within the same text field.

This is accomplished using "\n" in the prefix, but can also be applied to the suffix.

Click on Save and Continue Edit

If your config format is incorrect, you will receive an error message informing you of such.

Navigate to or create a product containing a text field

Select the advanced configuration options for the text field

Update the Field text cache to contain both variables

You will note that both our available variables are now detailed below this field.

For this example, we simply want the Title variable placed immedietely after the Name variable.

Update the Field text cache to contain both variables

With both variables present in the Field text cache of field, both will have associated inputs on the main form.

Entering a value in the first field will hide all variables names within that field ,and the resulting text for only the completed form entries will be shown.

As we had a line break built into the variable suffix, entering a value into the Title form field will automatically add a line break.

Well done!

Create how-to guides like this in a snap. Get Tango now.