Prepopulate a web form

Key Concepts

• Sending prepopulated emails from data in a column
• Option to update data
• Lookup data in a column

Autogenerated Transcript

Welcome back to Catalytic! In our last video, we went over how to create a batch process to go through every row of a table and send out a webform to gather information from users.

In this video, we’re going to be building a similar update address process.

But we won’t be creating a batch will be focusing on pre populating web form fields with table data, the process that will be built will have a user submit their email address when they start the workflow, then there’ll be sent an email with a link to a web form that has their address pre populated, the user will be able to decide whether or not they want to update their address and be able to input it based off of some business rules wrapped around our form fields.

For this process, I’m going to be using a similar data set to the last couple of videos where we just have two columns, email and mailing address.

To get this started, I’m just going to go ahead and upload this dataset, which has my own information added to the end here.

Navigating back to catalytic, I’m gonna go ahead and open up the Data tab, so we can go ahead and upload that new table.

So I’m going to create a new data table.

And I’ll go ahead and import that CSV or Excel file with that data that has the mailing addresses and emails.

So I’ll go ahead and create that table.

And it looks like it uploaded.

Now that the table is created, I’m gonna navigate over to our workflows section.

And I’m just going to go ahead and create a new workflow from scratch.

I’ll go ahead and give the workflow a name.

And let’s just go ahead and create it.

I’m not going to add a trigger to this flow.

But I am going to set up a form field to input an email address.

So let’s go ahead and set that up.

I’m going to navigate to form fields, add a field and we’ll just call this email.

I’ll keep the type as short text.

And let’s go ahead and save that.

Now that the forum field is set up, let’s go ahead and add our first action into the workflow.

Since we’ll be pre populating a webform, we just need to grab the data we want to display to the user first.

In this case, it’ll be the mailing address grab from the table.

So let’s find that lookup data in a column step since that’s what we’re going to be using.

So I’ll describe that process.

And catalytic found the correct step.

Now we just have to configure this action.

Similar to video nine, we’re going to be using the email address as our primary key to look up in return the mailing address that the user has submitted.

So let’s go ahead and configure this.

The data table we’ll be using will be the mailing addresses from lesson 11.

The column we’ll be looking up will be by that email.

And the search term will be the email that is our form field.

We’re going to return the mailing address.

And that’s everything that we have to do in order to set up this step.

So let’s go ahead and save it.

Now that we’ve configured our lookup step, I’m going to go ahead and add the step to send the user of webform.

So let’s just describe that process.

And catalytic found the correct action.

And that we can start configuring this webform, I’m going to go ahead and add some form fields to this webform, the first of which will be current address.

But before I do that, I’m going to go ahead and open up the outputs of the lookup data in table columns step.

And I’m going to go ahead and copy that mailing address output, because that’s going to be the value that will be the default value for our flow field.

And they’ll make sense in a minute, as soon as we go ahead and set that up.

Now again, the first form field that we’re going to be adding is going to be the current address.

And that’s just going to stay as short text.

Now in order to actually pre populate the webform.

That is to show the current address that we grabbed from the lookup data in a column step, we’re just going to go ahead and paste that field value or that field reference under our default value.

So the default value is just whatever value will be shown to the user when they view this webform originally.

So now that we have that setup, I’m just going to go ahead and save this.

I’m going to go ahead and add two more fields.

So the next one I’m going to add is going to be an update address option which will be a yes or no single choice drop down.

So that way, if we select yes, then a another field of updated address will appear, which allows the user to input the address that they want to update in the system.

So let’s add that first one.

Again, we’ll just call that update address it will be a single choice and the options will be yes and no.

Let’s go ahead and save that.

And let’s add one more field in this will be the updated address.

So again, the updated address is going to have a business rule or some logic wrapped around it.

So it only appears when the update address option is yes, so let’s go ahead and add that condition.

If the field update address is the field choice of yes, then we will go ahead and show the field so we can input our updated address.

And now we’ll just go ahead and save that.

And I’m just going to go ahead and configure the rest of this send a webform step.

So it’s going to be sent to the email address that we’re submitting.

So I’m just gonna go ahead and copy that email address and paste that reference here.

I’m gonna go ahead and fill out the rest of this.

So it looks like it’s a legit email that’s coming through.

So let’s call the subject, change address form.

And the email body will say hello.

Please indicate with the webform whether or not the address is correct, and add any changes, I’m not going to have a footer or any attachments to this, but let’s go ahead and give that form a title of change address form.

And I’m not going to be filling out the instructions, but feel free to fill out any of these that you’d like to.

So that’s gonna be everything as far as configuring the step.

So now I’m just gonna say that.

And we can go ahead and add the last step in our process, which will be to update the row if a user submits a new address.

So let’s go ahead and describe that process.

Again, it’s going to be the update of vote and table action, or just update a row.

And catalytic found the correct step for us.

And I’ll go ahead and configure this update of row step.

So again, that data table we’re going to be finding is going to be the less than 11 mailing addresses that I uploaded.

So I’ll select that.

And the column that we’re going to be finding the correct row to update will be based off of the email, again, that email we are submitting when we kick off the workflow.

So I just copied that field reference from the right side.

The column that we’re going to be updating will be the mailing address, and the value that we’re going to update it with is going to come from that send webform to user with the updated address, I’m going to make sure that I put quotes around this, that way, we can get the entire value in case there’s any commas in that.

And I’ll keep the update all as false.

Now one more thing that I’m going to add is I’m going to add a condition to this.

So that way, it only runs this update a row step, when we actually indicate that we want to update our address similar to that logic that we added in the form field itself.

So that’s going to be the update address option.

If the field choice is yes, then we will go ahead and have this step run.

Otherwise, we’re not going to update the address or update the row in our table.

And now that that’s all configured, I’m just going to go ahead and save the step.

Now that all the steps are set up, let’s go ahead and test this workflow.

So I’m going to use that test button.

And I’m just going to go ahead and put my female.

And we’ll go ahead and start this workflow and run it.

So we have our workflow kicked off, and it looks like an email was sent to my inbox.

In order for me to complete this webform.

I’m gonna navigate over to my inbox where we see that that email came in.

And I can just click on this Get Started button to actually start filling out this webform.

Now again, it’s going to have that pre populated address in our current address because we’ve defined what the default value is for this field.

So I’m going to select Yes for update address.

And for the updated address, I’m going to go ahead and put in one of my neighbor’s addresses here.

And let’s go ahead and just submit this webform.

And that will be everything we have to do in order for this process to complete.

Navigating back to catalytic and just refreshing this workflow that we have running, we can see that the entire process has been completed.

So now let’s just go over to the data tab and make sure that the table actually updated correctly.

Or actually, I could just go ahead and click on this last step here.

And we can go ahead and view the data table of mailing addresses from lesson 11.

Scrolling down to the bottom, where I have my information, we can see that the new address I submitted successfully updated in this table.

And again, this is just a pretty simple example to show you how you can pre populate forms using table data.

If you wanted to make this process more complex, you could put this pattern in a batch process and send the webform to every user in your instance so they can update their address if needed.

There’ll be one more video in our core video series on data processing with catalytic tables.

We’ll be going over sending table data in an email next.

Thanks for tuning in.