Tips, Tricks & Best Practices

MFortier
Member

Form redirect based on property selection

SOLVE

hey all - 

 

I'm looking to add some logic to one of my forms where when certain options from a property are selected they will be directed to a different page upon submission from the overall submission redirect. Has anyone thought about doing this and figure out how?

0 Upvotes
2 Accepted solutions
Phil_Vallender
Solution
Most Valuable Member | Diamond Partner
Most Valuable Member | Diamond Partner

Form redirect based on property selection

SOLVE

Hi @MFortier 

 

You would most likely need to use a custom form (and send the contact to HubSpot by API to achieve this) and determine the correct destination page in the browser following submit.

 

Dynamic routing to a different landing page based on the form submission is not currently supported by HubSpot - nor is it recommended to use Smart personalisation on the landing page following first conversion as there is a delay needed to allow HubSpot to create and process the contact details - this would affect the routing too. 

 

Hope this helps.

Phil Vallender | HubSpot Website Agency

View solution in original post

andrewzistler
Solution
Participant

Form redirect based on property selection

SOLVE

Here is a snippet of javascript that will do just that - but it's not completely working just yet. (See the notes below.) Just embed it like you would embed any regular HS form.

Important Notes:

  • You'll need to replace the xxxx with your portal ID, Form ID, internal property name, and external form text question.
  • The property type you use must also be visible on the page (ie, a radio select type property.)
  • With this method form fills from updated iOS devices don't send the form submission to HubSpot.
    • You can work around this by changing "onFormSubmit" to "onFormSubmitted"
    • However, then the redirect doesn't work.
    •  

I'm troubleshooting now, and I'll let you know if I find an answer.

In the meantime, I could see the code below being great for a very general form redirect on specific answer selection. Maybe you could daisy-chain forms, and have this form simply be a one-question form that then redirects to the desired page? 

<!--[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: "xxxxxxx",
		formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
		onFormSubmit: function($form) {
			var choice = $('input[name="xxxx(internal property name)xxxx"]:checked').val();
			if (choice == 'xxx(external form question text 1)xxxx') {
				window.location = 'http://www.example-1.com';
			} else if (choice == 'xxx(external form question text 2)xxxx'){
				window.location = 'http://www.example-2.com';
			} else if (choice == 'xxx(external form question text 3)xxxx'){
				window.location = 'http://www.example-3.com';
			}
		} 
	});
</script> 

 

View solution in original post

4 Replies 4
ADale
Member | Elite Partner
Member | Elite Partner

Form redirect based on property selection

SOLVE

Not to bring back an old thread, but I did want to follow up with this since its one of the higher results.

I built an almost a script you can steal that does what you're looking for very easily. Just need to make three tweaks to it, the names of the properties, the values that may come through and what link you want them to redirect to.

How to post here: https://areveo.com/hubspot-form-custom-dynamic-redirect/
Hopefully this helps!

andrewzistler
Solution
Participant

Form redirect based on property selection

SOLVE

Here is a snippet of javascript that will do just that - but it's not completely working just yet. (See the notes below.) Just embed it like you would embed any regular HS form.

Important Notes:

  • You'll need to replace the xxxx with your portal ID, Form ID, internal property name, and external form text question.
  • The property type you use must also be visible on the page (ie, a radio select type property.)
  • With this method form fills from updated iOS devices don't send the form submission to HubSpot.
    • You can work around this by changing "onFormSubmit" to "onFormSubmitted"
    • However, then the redirect doesn't work.
    •  

I'm troubleshooting now, and I'll let you know if I find an answer.

In the meantime, I could see the code below being great for a very general form redirect on specific answer selection. Maybe you could daisy-chain forms, and have this form simply be a one-question form that then redirects to the desired page? 

<!--[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: "xxxxxxx",
		formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
		onFormSubmit: function($form) {
			var choice = $('input[name="xxxx(internal property name)xxxx"]:checked').val();
			if (choice == 'xxx(external form question text 1)xxxx') {
				window.location = 'http://www.example-1.com';
			} else if (choice == 'xxx(external form question text 2)xxxx'){
				window.location = 'http://www.example-2.com';
			} else if (choice == 'xxx(external form question text 3)xxxx'){
				window.location = 'http://www.example-3.com';
			}
		} 
	});
</script> 

 

DEnglish6
Participant

Form redirect based on property selection

SOLVE

I couldn't agree more. Without this functionality there is no personalisation possible, based on their preferences and therefore everyone gets the same, generic experience.

Phil_Vallender
Solution
Most Valuable Member | Diamond Partner
Most Valuable Member | Diamond Partner

Form redirect based on property selection

SOLVE

Hi @MFortier 

 

You would most likely need to use a custom form (and send the contact to HubSpot by API to achieve this) and determine the correct destination page in the browser following submit.

 

Dynamic routing to a different landing page based on the form submission is not currently supported by HubSpot - nor is it recommended to use Smart personalisation on the landing page following first conversion as there is a delay needed to allow HubSpot to create and process the contact details - this would affect the routing too. 

 

Hope this helps.

Phil Vallender | HubSpot Website Agency