When users wish to embed a HubSpot form on a website they will most likely use the HubSpot embed code provided by the HubSpot Form editor. This is of course not the only way to integrate HubSpot forms with your website - but it is a very easy and common one.
The embed code provided by HubSpot covers a very basic use-case (an embeddable HubSpot form, with no unique post-submission behavior, and with settings defined in HubSpot Graphical User Interface).
If you do have advance use-cases AND you wish to solve them via embedded forms - you will need to Customize the embed code. What you might be unaware of is that the possibilities of HubSpot Embed code are broader than what HubSpot describes in their documentation.
HubSpot describes the following requirements for Customizing the form embed code:
These options are only available for forms created using the marketing form builder in Marketing Hub and CMS Hub Professional or Enterprise subscriptions.
These options can only be used with forms that have been set as raw HTML.
Other forms, such as collected forms or lead flows, do not support these customization options.
In reality - the 2nd requirement is only a suggestion - You can, if you wish, control the behavior of HubSpot forms that are not set as Raw HTML. It will require extra effort, but it is possible.
Here are a few examples of advanced form behavior, using the embedded code and it's built-in "onFormSubmit" function, working with 'plain vanilla' forms.
Please note that I'm not a developer - The examples below are served mostly as a way to 'open' your appetite for more advance use cases with HubSpot forms, and to show that you are not limited to forms that were set to Raw HTML:
Full Name splitting to First Name and Last Name
This demo uses a full name custom property, and two hidden properties for First Name and Last Name:
But wait Itzhak, why not use a Webhook/Zapier/etc? I heard you are a fan!
If you split the full name prior to pushing it to HubSpot, any processes that might use the first name / last name fields (be it notifications, processes in external CRM such as SFDC etc.) will be done correctly, and will not require unnecessary delay intervals. If you the above is too complex for you, you might want to consider the automation route anyway.
Redirecting after a Form Submission, but Based on the submitted data in the form
This one has many practical uses such as Resource Centers that redirect user to an asset based on questions the user answered in a form, or for landing pages that allow a user to register to a webinar that is being conducted several times for different time-zones, etc.
The below example will redirect you to Yahoo or Google based on your form choice (don't forget to hit the back button after you test it out :) )
These are but a few examples that show that knowing a bit of coding can get you a long way using the same platforms you are used to work with.
[Update 16.01.22] - be sure to check some examples of onFormReady in my next post on the topic here.