Customise selected option in a form embed based on previous page

Developer Support APIs & Integrations
1

Hi,

I’m looking to auto select an option in a embedded form based on a where a user arrived at our form from.
I’m using a javascript function to check if the referral path matches the value the form select field.
What I can’t figure out is how to set the correct option to selected.

Any help on this would be greatly appreciated.

Thanks

2

Hi @matttunney

I know that you can autopopulate forms using a query string in the page URL.

You can use a static string if you know where traffic is coming from (email campaign, ads, social post, etc.). Change the query for each channel to populate the right field in this use case. I love this because it works for hidden fieds as well.

Is this what you are using when you mentioned the function you have implemented to check referral path?

Here is a knowledge base article I like that helps as a starting point: Auto-populate form fields with a query string

Hopefully that solves for what you are looking for. If not, I’d love to see what you have set up and brainstorm some options from there.

Best,

Diana

3

So I have a fix for this that triggers on ‘onformReady:’

The set_select_option tests the document referrer for a matching value and returns the appropriate value that should match the hubspot select value

function set_select_option() {

 if(document.referrer.length === 0) {
 return false ;
 }

 var ref = document.referrer,
 result = false;

 if(ref.includes('url-value')) {
 result = 'a matching value';
 } else if (ref.includes('another-url-value')) {
 result = 'a different value';
 } else {
 result = false;
 }

 return result;
}

hbspt.forms.create({
 portalId: '1111111',
 formId: '111111111-111111111-111111111-111111111',
 target: '#target',
 css: '',
 onFormReady: function($form) {
 (set_select_option() !== false) ? $('select[name="area_of_enquiry"]').val(set_select_option()) : '';
 },
 onBeforeFormInit: function($form) {
 },
 onFormSubmit: function($form) {
 }
})