Lead Capture Tools

SMcGarrigle
Member

Create a reactive thank you page based on selection of one criteria in a field in a form

I’ve created a form in my Hubspot website and I want a conditional redirect dependant on the choice in a radio box on the form.

Example:

 

Customer A picks X criteria send them to product A on submission

Customer B picks Y criteria send them to product B on submission

I’ve got some custom HTML to use with the embed form HTML but for some reason it’s not working using a HTML module on a page.

Hubspot claim this is not a native function and I need to box off a workaround although I can find forums with similar issues online none of the suggested edits seem to work for me.

Can anybody help?

 

0 Upvotes
6 Replies 6
SMcGarrigle
Member

Create a reactive thank you page based on selection of one criteria in a field in a form

So I've found a work around for this, create a custom module in Hubspot and use the following code. I don't know how to link the code without screen grabbing it on here. Inset this code into the custom module, then insert the module into the page you want. This will only redirect based upon the value of one field. you can replicate the ELSE IF section of the code if there are more than 3 options.

 

To change the code replace where I have put in Capital letters:

NAME1
NAME2

NAME3

OPTION

These 4 above are up to you to decide and are merely for referencing for the code to work so as long as they are the same above and below then that's all that matters

 

WEBSITE1 

WEBSITE2

WEBSITE3

These are the web addresses you want the page to re-direct to depending on selection

 

 

NAME OF DEPENDENT FIELD

Go to you form and right click on it, click inspect and find out the true name of the value you want to redirect based upon. E.g    How_Much_Is_Your_Budget?

Make sure this is copied exactly how it appears in the inspector.

 

FIELDVALUE1
FIELDVALUE2

FIELDVALUE3

Make sure these are copied exactly how it appears in your form for the values is the field we have named above, e.g £1-£2 include the spaces if you have any in the field so it might be £1 - £2

 

Obviously make sure you update your portal id and form id also at the top where the XXXXX are

 

 

Picture1.png

 

 

0 Upvotes
Ben_M
Key Advisor

Create a reactive thank you page based on selection of one criteria in a field in a form

If the form isn't appearing it's likely due to an error. The only way to solve this is to open it in your browser and view the console in the inspector ( right click --> inspect).  I was able to clean up the code, but I've run into an issue with this type of field and the value is being returned undefined.  I saw another post on the matter on these forums mentioning this same situation about having to serialize the form data to do this type of redirect, but I have not yet had a chance to look at your code to see if this would work:  https://community.hubspot.com/t5/APIs-Integrations/Getting-form-field-on-form-submit/td-p/316974 

SMcGarrigle
Member

Create a reactive thank you page based on selection of one criteria in a field in a form

SMcGarrigle_0-1614678659177.png

 

0 Upvotes
SMcGarrigle
Member

Create a reactive thank you page based on selection of one criteria in a field in a form

I've been using this in the custom html module on a website page within hubspot

The form just doesn't appear, so I don't know if it would redirect when the criteria data is inputted

0 Upvotes
SMcGarrigle
Member

Create a reactive thank you page based on selection of one criteria in a field in a form

I've been using this in the custom html module on a website page within hubspot

The form just doesn't appear, so I don't know if it would redirect when the criteria data is inputted

 

<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: '8973329',
formId: 'f593c5a5-6b76-4215-b862-31a930c134c0',
onFormSubmit: function($form) {
var favouriteFruit = $form.find('select[name="price"]').val();

setTimeout( function() {
if ( price == "200" ) {
window.location.href = "https://en.wikipedia.org/wiki/Pineapple";
}> if ( price == "300" ) {
window.location.href = "https://en.wikipedia.org/wiki/Banana";
} if ( price == "400" ) {
window.location.href = "https://en.wikipedia.org/wiki/Grape";
}
</script>

0 Upvotes
Ben_M
Key Advisor

Create a reactive thank you page based on selection of one criteria in a field in a form

You can use the FormsAPI to customize what happens with an embedded form after it is submitted. https://legacydocs.hubspot.com/docs/methods/forms/advanced_form_options

 

When you say you have custom HTML would it work in that event?  Or can you share what you are trying to use to embed the form but running into issues with?