topic Re: How to make redirection urls dynamic in hubspot module. in CMS Development

How to make redirection urls dynamic in hubspot module.

FurqanAli — Tue, 14 Mar 2023 13:38:43 GMT

Hi there,

I was working on setting the form redirection after submission based on the select box values in my form and I was able to set it up in javascript but how I can make it dynamic by adding the possibility to a set URL for different options from my module in the editor using hubl.

my javascript code:
let result;
// console.log("Checking result: "+result);
window.addEventListener('message', event => {
if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {
result = event.data.data.find(x => x.name === 'workspace_size').value;
}
if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
if (result === '1-45') {
window.location = 'https://www.example1.com';
} else if (result === '46-200'){
window.location = 'https://www.example2.com';
}
}
});

Re: How to make redirection urls dynamic in hubspot module.

BarryGrennan — Wed, 15 Mar 2023 03:36:12 GMT

Add some URL fields to your module and put your js inside a {% require_js %} tag in the modules HTML + HubL area like this:

{% require_js %} <script> let result; window.addEventListener('message', event => { if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') { result = event.data.data.find(x => x.name === 'workspace_size'').value; } if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') { if (result === '1-45') { window.location = '{{ module.url_1.href }}'; } else if (result === '46-200'){ window.location = '{{ module.url_2.href }}'; } } }); </script> {% end_require_js %}

{{ module.url_1.href }} and {{ module.url_2.href }} being the call to the module fields.

I tested it in my portal and it works 🙂

Barry Grennan

Freelance HubSpot CMS Developer

Website | Contact | LinkedIn

Re: How to make redirection urls dynamic in hubspot module.

FurqanAli — Wed, 15 Mar 2023 11:51:30 GMT

Thanks a lot, @BarryGrennan I had a similar solution in my mind.

Re: How to make redirection urls dynamic in hubspot module.

DHarrison0 — Thu, 16 Mar 2023 12:17:30 GMT

@FurqanAli wrote:
Hi there,

I was working on setting the form redirection after submission based on the select box values in my form and I was able to set it up in javascript but how I can make it dynamic by adding the possibility to a set URL for different options from my module in the editor using hubl.

my javascript code:
let result;
// console.log("Checking result: "+result);
window.addEventListener('message', event => {
if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {
result = event.data.data.find(x => x.name === 'workspace_size').value;
}
if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
if (result === '1-45') {
window.location = 'https://www.accedii.com';
} else if (result === '46-200'){
window.location = 'https://www.example2.com';
}
}
});

Thanks For It! I'm also suffering from this issue and it really helpful.