Show invalid email validation error manually in HS form and prevent form submission using JS

Developer Support CMS Development
1

Hi,
I have a HubSpot form that has an email field that automatically fills with a query param. I need to check if the user has made any changes to the auto-filled email and display an error message for invalid email validation. To achieve this, I use JavaScript on form submission. Additionally, I need to prevent the form submission and keep the user on the form page. Is there a method to accomplish this?

2

Hey, @dmadusanka :waving_hand: Thanks for your question.

Can you tell the community more about what you’ve already tried? Or even better, what you’ve tried that didn’t work.

I’d guess you’re going to need an event listener + some regex or other form of validation to make sure your query param is intact.

One question, are you informing the user before they get to the form, they should not try to update this field?

More big picture questions:

  • Have you found any HubSpot community posts or JavaScript documentation to support your project?
  • What’s the user experience you’re trying to achieve? Is there a specific reason for having the email auto-filled and then ensuring it’s not changed?
  • What’s your preferred fallback behaviour if the user does attempt to change the email?

Thanks for the additional information! — Jaycee