Redirect a HubSpot form to a thank you page based on a form field

Sometimes you may want to use a conditional redirect to send visitors to different thank you pages based on an answer they've selected on your form. For example, you might have a dropdown field asking them what location they are based in and you can redirect them to a specific Meetings link with a sales rep in their region.

As of June 2025, HubSpot has two types of forms: 

1. Legacy Forms: require custom scripts for the conditional redirect
2. New Form Editor: can be redirected directly in the form editor

Below you'll find instructions for each type.

Sample Data: The Test Form Field

For testing purposes, I've created a custom contact property called "Favourite Fruit" used in all of the examples below. It's a "Dropdown Select" type and has three options: Pineapple, Bananas and Grapes.

For the code snippets below, it's important to know the internal name for your property (favourite_fruit in this example):

And the internal name for each property option (Pineapple, Banana, Grapes in this example):

In our examples, when the form is submitted, the user will be redirected to the Wikipedia page for the fruit they've selected.

1. Legacy Forms

For legacy forms, you can use HubSpot's onFormSubmit event to detect when the form is submitted, find a particular field and update the URL based on the answer.

These will be different depending on whether your form is:

1. On a HubSpot website
2. An embedded form on a non-HubSpot website.
   
   

1a. Legacy Form on a HubSpot Website - Form Event Listener

The script to detect form submission event looks like this: 

window.addEventListener('message', event => {
  if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {

    for (item in event.data.data) {
      if (event.data.data[item]["name"] == "favourite_fruit") {
        if (event.data.data[item]["value"] == "Pineapple") {
          window.location = "https://en.wikipedia.org/wiki/Pineapple";
        }
        if (event.data.data[item]["value"] == "Bananas") {
          window.location = "https://en.wikipedia.org/wiki/Banana";
        }
        if (event.data.data[item]["value"] == "Grapes") {
          window.location = "https://en.wikipedia.org/wiki/Grape";
        }
      }
    }

  }
});

The script detects the "onFormSubmit" event, loops through event.data.data to see what the user submitted on the form, using event.data.data[item]["name"] to get each form field's internal value and event.data.data[item]["value"] to see what the user entered in that form field.

In our example, we're using a condition to look for the field's internal name (favourite_fruit), and check which value (Pineapple, Bananas, Grapes) was selected.

Live Demo
 

1b. Legacy Form embedded on a non-HubSpot website - Embedded Form Event

Because embedded forms are used within an iframe, the above code will not work. One option is to use set the "render as HTML" option in the style section of your form to prevent it from appearing in an iframe so that you can use the code above.

Alternatively, when you're embedding your for you can adjust the script to include the onFormSubmit logic:

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
  hbspt.forms.create({
    portalId: '123456',
    formId: 'abcdef12-12345fff-9876a1b2c3',
    region: "na1",
    onFormSubmit: function($form) {
      var favouriteFruit = $form.find('select[name="favourite_fruit"]').val();

      setTimeout( function() {
        if ( favouriteFruit == "Pineapple" ) {
          window.location.href = "https://en.wikipedia.org/wiki/Pineapple";
        }   
        if ( favouriteFruit == "Bananas" ) {
          window.location.href = "https://en.wikipedia.org/wiki/Banana";
        }   
        if ( favouriteFruit == "Grapes" ) {
          window.location.href = "https://en.wikipedia.org/wiki/Grape";
        }

      }, 500 ); // Waits 1/2 second to redirect.
    }
  });
</script>

Within this event you can use JavaScript or jQuery to find the field value, using a selector like var myField = $form.find('input[name="FieldID"]').val();

2. New Forms Editor

The new forms editor has it's own logic tools that you can use to redirect the form on submission. 

For example, when I add the "Favourite Fruit" field to the form, I can: 

1. Click into the "Logic" tab
2. Select the condition (e.g. "If field Favourite Fruit is any of Pineapple")
3. Select the action (e.g. "Then redirect to (on form submit) a HubSpot page")

Other Field Types

In our example we've used a dropdown select field, but you can adjust the logic above to check other field types.

Number Field - Checks if number is within a certain range:

window.addEventListener('message', event => {
  if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {

    for (item in event.data.data) {
      if (event.data.data[item]["name"] == "number") {

        if (event.data.data[item]["value"] <= 50) {
          window.location = "https://en.wikipedia.org/wiki/Tomato";
        }
        if (event.data.data[item]["value"] >= 51 && event.data.data[item]["value"] <= 100) {
          window.location = "https://en.wikipedia.org/wiki/Pepper";
        }
        if (event.data.data[item]["value"] >= 101 && event.data.data[item]["value"] <= 500) {
          window.location = "https://en.wikipedia.org/wiki/Zuchinni";
        }
        if (event.data.data[item]["value"] >= 501) {
          window.location = "https://en.wikipedia.org/wiki/Carrot";
        }


      }
    }

  }
});

Live Demo