How to Manipulate Text (String) with Conditions and Calculation

When integrating forms with your current existing workflow, oftentimes, you’ll find yourself stuck on something really specific, like:

• Generating links based on user input
• Auto-generate email addresses
• Create a comma-separated set of values

No matter what the use case may be, knowing how to manipulate texts (strings) would be a huge help in building interactive forms.

So in this guide, we’ll be focusing on the Use Cases mentioned above. Your imagination and creativity would only go as far as how you understand Conditions and Calculations.

Here’s the demo form that was used for this guide.

Generating Links Based on User Input

1. Create the fields needed for the link or URL to be generated. In the example form that we’ll be working on, there are only two options – the product code (a drop-down menu) and whether it’s customized or not (a radio button).

2. Add the textbox field that will fetch the generated URL.

3. Then set up the Condition as follows:

You would notice that there are no operators needed (i.e. no need to add or use the plus (+) sign to concatenate the texts). Just type them in directly then add the fields in between when needed.

https://mydomain.com/checkout.php?prod={addFieldHere}&custom={addFieldHere}

Auto-Generate Email Addresses

Create the fields needed to generate a well-formed email address. The part before the @ symbol (local-part) identifies the name of a mailbox. This is often the username of the recipient, e.g., jsmith. The part after the @ symbol (domain) is a domain name that represents the administrative realm for the mailbox, e.g., a company’s domain name, example.com.

In our example form, the local-part would be a textbox and the domain would be a drop-down menu with predefined domain options.

This will be the Condition to populate the other textbox that will fetch the calculated text.

Just like the previous method, you won’t need to use operators to concatenate texts/strings. Just type them in – this time, you add the textbox field, an @ symbol, then the drop-down field.

{addFieldHere}@{addFieldHere}

Create a Comma-Separated Set of Values

Lastly, to achieve this, the same idea/principle still applies. Just add the fields needed and append the comma in between them while ensuring all of them are rendered as texts/strings (with a brown background).

Here are some pointers when handling texts or strings with Conditions or Calculations:

• Anything you manually type in the Calculate field will be treated as text by default (with brown background).
• Any field you add (when you click the Add Field button) will be added as a number by default (with black background).
• If you wish to toggle back and forth from text to number (and vice versa), just click on each block.
• Pressing the TAB key will automatically render the text you typed in as a block of text/string.

Here’s the completed form so you can see it in action. Or, just watch the short clip below to see how it works.

You can clone this form, here’s how, so you can have a closer look at how it was set up.

Give it a whirl and don’t hesitate to leave a comment if you have questions.