Pass form value to external application through query string
SOLVE
Hi. I am looking to integrate a HS form with an external application. I am using Marketing Starter. The 3rd party asked us to supply our HS form values in this way:
I have the form set up but don't know what to do next to get this to work in Starter. I'm a real newbie and discovering just how powerful and useful HS is.
Thank you in advance for your guidance and advice.
You can also embed a HubSpot form using the form embed code in a HubSpot hosted page. This is particularly useful when you need to customise your form as in your use case. You just need to embed the code in a Rich Text module (select advanced menu in text editor and then source code) or a HTML module (available in the asset marketplace.)
Matthew Shepherd
Freelance HubSpot Consultant CRM Consultant | SEO Specialist
To provide you with the right approach, can you please specify which external application you are talking about. Also, clarify, whether you want to show data of your form to other place or want something else to work on? Regards.
As you need to send the data using specific parameter names you will need to use something like this jQuery solution. Your form embed code should end up looking something like the code below, but you will have to make sure the red bolded values in the code below are replaced with the values for your form, your submit message, the names of your form input fields, and the URL you want to redirect to.
hbspt.forms.create({ portalId: 'xxxxxxxx', formId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx', inlineMessage: 'Your submit message here', onFormSubmit: function($form){ setTimeout( function() { var email = $form.find('input[name="email"]').val(); var firstname = $form.find('input[name="firstname"]').val(); var lastname = $form.find('input[name="lastname"]').val(); var phone = $form.find('input[name="phone"]').val(); var desirednumber= $form.find('input[name="desirednumber"]').val(); var redirectBase = '<app-url>/external-access'; window.location = redirectBase + '?email=' + email + '&firstName=' + firstname + '&lastName=' + lastname + '&phone=' + phone + '&desiredNumber=' + desirednumber; }, 250 ); // Redirects to url with query string data from form fields after 250 milliseconds. } });
We have a form on a HubSpot website page and after form submission, want to redirect to a non-HubSpot page, passing parameters in the URL based on the form submission.
The expected use is for new contacts to HubSpot -
We've been trying a redirect with URL formed as below but it is not working (either null values for parameters or the default value):
You can also embed a HubSpot form using the form embed code in a HubSpot hosted page. This is particularly useful when you need to customise your form as in your use case. You just need to embed the code in a Rich Text module (select advanced menu in text editor and then source code) or a HTML module (available in the asset marketplace.)
Matthew Shepherd
Freelance HubSpot Consultant CRM Consultant | SEO Specialist
Pass form value to external application through query string
SOLVE
Thanks again Matthew. I'm grateful for the time and thought you are giving my question. I've passed your suggestion on and I'll let you know how things turn out.
Pass form value to external application through query string
SOLVE
Hi @Srappaport26, can you let me know which solution you ended up implementing and what worked for your team? I'm now in a very similar situation and could use some help.
Pass form value to external application through query string
SOLVE
Hey Amanda,
I'm @Srappaport26's co worker. We went the jquery solution originally posed by Mathew Sheppard. Our working code looks almost identical except for some additional logic tweaks and variables as features were added over time. As he mentions in his second response we used this code inside a richtext embed that was inside a custom hubspot form module. Works great, and as I mentioned it was easy to update as well. I've not got some if/else statements at the end that pass different parameters back depending on what parameters were found already in the URL referring string, if any.