Would love this feature too. Would be really useful!
For example: Some type of customers we would like to redirect to a meeting page, for others, to a video demo page.
Would love this feature too. Would be really useful!
For example: Some type of customers we would like to redirect to a meeting page, for others, to a video demo page.
I was directed to this idea when I was checking into using two buttons on a form. We’ve been using a Survey Monkey integration to collect info in HubSpot, but the connection isn’t robust enough. So, we’re building an application form using landing pages. Mimicing Survey Monkey, we want break it into multiple pages, and are doing so by redirecting the submission to the next page. The element we’re missing is being able to give the applicant the option to navigate back to the previous page. Would really like to be able to have 2 buttons so we could add the BACK and NEXT functions.
You can specify conditional redirects by modifying the embed code. In this example I used radio buttons to determine the redirect URL:
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "xxxxxxx",
formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
css: "",
onFormSubmit: function($form) {
var choice = $('input[name="redirect_choice"]:checked').val();
if (choice == 'Redirect 1') {
window.location = 'http://www.example-1.com';
} else if (choice == 'Redirect 2'){
window.location = 'http://www.example-2.com';
} else if (choice == 'Redirect 3'){
window.location = 'http://www.example-3.com';
}
}
});
</script>
Hope that helps!
This would be great. I would love this feature.
yes, i need this!
I just had this need today. We are doing an email and paid ads to get people to our tradeshow booth. I would like to ask, are you attending the tradeshow.
If yes, then go down a path to book a demo time and show them the booking calendar widget that only has the 4 days of the tradeshow as options. Drip with our booth #, and a few other things that make us unique.
If NO, then they go a separate page that has an embedded presentation with an option to book a demo time after the tradeshow, so I would embed my normal calendar into this other page.
Right now, I think the only way to do this is have an initial splash page with 2 CTAs - are you going? Yes or No and then redirect them to 2 separate landing pages. Correct?
This is very important for us. We have a company account, and we have many problems with users who register and do not comply with a necessary feature to become a customer. If Hubspot would have this solution we could ask if they have that feature in advance and redirect them to 2 different thank-you pages depending on what they select. Please do it fast !!
YESSSS!!! I am wanting to create a complex form that would be used for price requests for mutiple models of machines. Since all the machines have different prices I would like to be able to direct the filler to a specific landing page to download that specific price for the machine requested.
This would be a very complex form, but would save me form creating many forms that look almost identical.
We really need this functionality too. It’s a must-have.
I am trying to follow anders solution that he posted but I am using a Dropdown (select) box how would I do the same logic but using a select value instead?
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "xxxxxxx",
formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
css: "",
onFormSubmit: function($form) {
var choice = $('input[name="redirect_choice"]:checked').val(); -- need this to be for a select box based on lead_type
if (choice == 'Redirect 1') {
window.location = 'http://www.example-1.com';
} else if (choice == 'Redirect 2'){
window.location = 'http://www.example-2.com';
} else if (choice == 'Redirect 3'){
window.location = 'http://www.example-3.com';
}
}
});
</script>
I don’t understand your question -
Hi, see example using select below:
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "xxxxxx",
formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
css: "",
onFormSubmit: function($form) {
var choice = $('select[name="redirect_select"]').val();
if (choice == 'Page one') {
window.location = 'http://www.example-1.com';
} else if (choice == 'Page Two'){
window.location = 'http://www.example-2.com';
} else if (choice == 'Page Three'){
window.location = 'http://www.example-3.com';
}
}
});
</script>
Yeah, and it works well. Do you have an issue with it?
Make sure that you DON’T tell hubspot to redirect to another page on the “Options” tab of the form builder. Instead, Diplay a thank you message, write something like “Thank you for submitting the form. You will be redirected shortly.” and then you shouldn’t have any redirect issues on the window.location piece.
I cant believe we dont have this feature yet ![]()
@anders_grove I am trying to make your setup but for a single checkbox field. When someone checks the box they are directed to one page, and when they don’t they are directed to a different page. The issue I am running into is the form does not let me edit the embed code. Where do I place the code?
Here is the code I have, does this look correct?
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "xxxxxxxx",
formId: "xxxxxxxxxxxxxxxxxxxxxxxxx",
sfdcCampaignId: "xxxxxxxxxxxxx”,
onFormSubmit: function($form) {
var answer = $('input[name=“answer_yes_no”]).val();
if (answer:checked) {
window.location = 'http://www.page-1.com';
} else {
window.location = 'http://www.page-2.com/product‘;
}
});
</script>
I was surprised to learn this wasn’t already a basic level of functionality when it is with other platforms. Please add this in asap.
Is there a way of adapting @anders_grove code for two sets of radio buttons that covers the various permutations of input?
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "xxxxxxx",
formId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
css: "",
onFormSubmit: function($form) {
var choice = $('input[name="redirect_choice"]:checked').val();
if (choice == 'Redirect 1') {
window.location = 'http://www.example-1.com';
} else if (choice == 'Redirect 2'){
window.location = 'http://www.example-2.com';
} else if (choice == 'Redirect 3'){
window.location = 'http://www.example-3.com';
}
}
});
</script>
Anyone know why when using this code that the object hubspt.forms is not being recognized?
Heck yeah, this worked for us!
We ask for Number of Employees in our forms so we can route leads to the right team.
Here’s how ours turned out:
<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "XXXXXXX",
formId: "XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX",
onFormSubmit: function($form) {
if($form.find('input[name="numberofemployees"]').val() >= 1 && $form.find('input[name="numberofemployees"]').val() < 😎 {
window.location.href = "https://www.google.com/search?q=smb";
}else if ($form.find('input[name="numberofemployees"]').val() >= 8 && $form.find('input[name="numberofemployees"]').val() < 26){
window.location.href = "https://www.google.com/search?q=mm";
}else {
window.location.href = "https://www.google.com/search?q=ent";
}
}
});
</script>