Infusionsoft webform redirect based on drop down selection

Question

I have a form crated in Infusionsoft that is basically 2 input fields: name and email a drop down select option and a submit button submit button. the form submits to infusionsoft and then re-directs to a thank you page.

I would like to have the user re-directed to a thank you paged that is based on the option they selected in the drop down menu.

Infusionsoft says its not possible, I'm hoping there wrong :)

Exmaple of my form:

http://jsfiddle.net/malditoklee/B2WAZ/

Any help would be greatly appreciated.

Thanks!

    <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

<body>
<style type="text/css">
.beta-base .preheader, .beta-base .header, .beta-base .sidebar, .beta-base .body, .beta-base .footer, #mainContent {
    text-align: left;
}
.beta-base .preheader, .beta-base .header, .beta-base .body, .beta-base .sidebar, .beta-base .leftSidebar, .beta-base .rightSidebar, .beta-base .footer {
    margin: 0;
    padding: 0;
    border: none;
    white-space: normal;
    line-height: normal;
}
.beta-base .title, .beta-base .subtitle, .beta-base .text, .beta-base img {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    white-space: normal;
    line-height: normal;
}
.beta-base .bodyContainer td.preheader{
    padding: 10px 0;
}
.beta-base .bodyContainer td.header {
    padding: 0;
    height: 30px;
}
.beta-base .bodyContainer td.body, .beta-base .bodyContainer td.footer,
.beta-base .bodyContainer td.sidebar, .beta-base .bodyContainer td.leftSidebar, .beta-base .bodyContainer td.rightSidebar {
    padding: 20px;
}
.beta-base .bodyContainer td.header p, .beta-base .bodyContainer td.preheader p, .beta-base .bodyContainer td.body p,
.beta-base .bodyContainer td.footer p, .beta-base .bodyContainer td.sidebar p,
.beta-base .bodyContainer td.leftSidebar p, .beta-base .bodyContainer td.rightSidebar p {
    margin: 0;
    color: inherit;
}
.beta-base .bodyContainer td.header div.title, .beta-base .bodyContainer td.preheader div.title, .beta-base .bodyContainer td.body div.title,
.beta-base .bodyContainer td.footer div.title, .beta-base .bodyContainer td.sidebar div.title,
.beta-base .bodyContainer td.leftSidebar div.title, .beta-base .bodyContainer td.rightSidebar div.title,
.beta-base .bodyContainer td.header div.subtitle, .beta-base .bodyContainer td.preheader div.subtitle, .beta-base .bodyContainer td.body div.subtitle,
.beta-base .bodyContainer td.footer div.subtitle, .beta-base .bodyContainer td.sidebar div.subtitle,
.beta-base .bodyContainer td.leftSidebar div.subtitle, .beta-base .bodyContainer td.rightSidebar div.subtitle,
.beta-base .bodyContainer td.header div.text, .beta-base .bodyContainer td.preheader div.text, .beta-base .bodyContainer td.body div.text,
.beta-base .bodyContainer td.footer div.text, .beta-base .bodyContainer td.sidebar div.text,
.beta-base .bodyContainer td.leftSidebar div.text, .beta-base .bodyContainer td.rightSidebar div.text {
    overflow: auto;
}
.beta-base .optout {
    margin-bottom: 10px;
    margin-top: 10px;
}
div.infusion-captcha {
    width: 220px;
    padding: 10px;
}
div.infusion-captcha input, div.infusion-captcha select, div.infusion-captcha textarea {
    width: 95%;
    display: inline-block;
    vertical-align: middle;
}
table.infusion-field-container td.infusion-field-input-container input[type='text'],
table.infusion-field-container td.infusion-field-input-container input[type='password'],
table.infusion-field-container td.infusion-field-input-container textarea {
    width: 98%; /* must be 98% to make the snippet-menu line up due to border width */
    margin: 0;
}
table.infusion-field-container td.infusion-field-input-container select {
    width: 101%;
    *width: 102%; /* this one for IE */
    margin: 0;
}
table.infusion-field-container td.infusion-field-label-container {
    padding-right: 5px;
}
td.header .image-snippet img {
    vertical-align: bottom;
}
#webformErrors {
    color: #990000;
    font-size: 14px;
}
html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}
.infusion-form {
    margin: 0;
    height: 100%;
}
.infusion-option {
    display: block;
    text-align: left;
}
</style>
<style type="text/css">
.beta-font-b h1, .beta-font-b h2, .beta-font-b h3, .beta-font-b h4, .beta-font-b h5, .beta-font-b h6 {
    font-family: arial,sans-serif;
}
.beta-font-b h1 {font-size: 24px;}
.beta-font-b h2 {font-size: 20px;}
.beta-font-b h3 {font-size: 14px;}
.beta-font-b h4 {font-size: 12px;}
.beta-font-b h5 {font-size: 10px;}
.beta-font-b h6 {font-size: 8px;}
.beta-font-b address {font-style: italic;}
.beta-font-b pre {font-family: Courier New, monospace;}
.beta-font-b .title, .beta-font-b .title p {
    font-size: 20px;
    font-weight: bold;
    font-family: arial,sans-serif;
}
.beta-font-b .subtitle, .beta-font-b .subtitle p {
    font-size: 11px;
    font-weight: normal;
    font-family: arial,sans-serif;
}
.beta-font-b .text, .beta-font-b p {
    font-size: 12px;
    font-family: arial,sans-serif;
}
.beta-font-b .preheader .text, .beta-font-b .preheader .text p {
    font-size: 11px;
    font-family: arial,sans-serif;
}
.beta-font-b .footer a {
    font-size: 11px;
    font-family: arial,sans-serif;
}
.beta-font-b .footer .text {
    font-size: 10px;
    font-family: verdana,sans-serif;
}
.beta-font-b .sidebar .title, .beta-font-b .leftSidebar .title, .beta-font-b .rightSidebar .title {
    font-size: 15px;
    font-weight: bold;
    font-family: arial,sans-serif;
}
.beta-font-b .sidebar .subtitle, .beta-font-b .leftSidebar .subtitle, .beta-font-b .rightSidebar .subtitle {
    font-size: 12px;
    font-family: arial, sans-serif;
}
.beta-font-b .sidebar .text, .beta-font-b .sidebar .text p, .beta-font-b .leftSidebar .text, .beta-font-b .rightSidebar .text {
    font-size: 11px;
    font-family: arial, sans-serif;
}
.infusion-field-label-container {
    font-size: 14px;
    font-family: arial,sans-serif;
}
.infusion-field-input-container {
    color: #000000;
    font-size: 12px;
}
.infusion-option label {
    color: #000000;
    font-size: 14px;
    font-family: arial,sans-serif;
}
</style>
<style type="text/css">
.default .background {
    background-color: #CCCCCC;
}
.default .body {
    background-color: #FFFFFF;
}
.default a {
    color: #F15C25;
}
.default .text {
    color: #787878;
}
.default .background .preheader a {
    color: #2A2928;
}
.default .background .preheader .text {
    color: #2A2928;
}
.default .header {
    background-color: #FFFFFF;
}
.default .title {
    color: #669940;
}
.default .subtitle {
    color: #F15C25;
}
.default .sidebar .title {
    color: #F15C25;
}
.default .leftSidebar .title {
    color: #F15C25;
}
.default .rightSidebar .title {
    color: #F15C25;
}
.default .sidebar .subtitle {
    color: #669940;
}
.default .leftSidebar .subtitle {
    color: #669940;
}
.default .rightSidebar .subtitle {
    color: #669940;
}
.default .footer {
    background-color: #7AC143;
}
.default .footer a {
    color: #00728F;
}
.default .footer .text {
    color: #2A2928;
}
.default .infusion-field-label-container {
    color: #000000;
    font-size: 14px;
    font-family: arial,sans-serif;
}
.default .infusion-field-input-container {
    color: #000000;
    font-size: 12px;
}
.default .infusion-option label {
    font-size: 14px;
    color: #000000;
    font-family: arial,sans-serif;
}
.default .webFormBodyContainer{
    border-style:Hidden;
    border-color:#000000;
    border-width:0px;
}
</style>
<style type="text/css">
.infusion-field-label-container {
text-align:Left;
}
.infusion-field-label-container {
vertical-align:Middle;
}
.infusion-field-input-container {
width:200px;
}
.bodyContainer {
width:425px;
}
</style>
<script src="https://bb128.infusionsoft.com/app/webTracking/getTrackingCode?trackingId=cd93e80c021ecce928cbd2c81c4262c9" type="text/javascript">
</script>
<form accept-charset="UTF-8" action="https://bb128.infusionsoft.com/app/form/process/aba18e7f1bf3f0570fc9f25bb2bd04ee" class="infusion-form" method="POST" name="Dermatend
Survey Opt-In" onsubmit="var form = document.forms[0];
var resolution = document.createElement('input');
resolution.setAttribute('id', 'screenResolution');
resolution.setAttribute('type', 'hidden');
resolution.setAttribute('name', 'screenResolution');
var resolutionString = screen.width + 'x' + screen.height;
resolution.setAttribute('value', resolutionString);
form.appendChild(resolution);
var pluginString = '';
if (window.ActiveXObject) {
    var activeXNames = {'AcroPDF.PDF':'Adobe Reader',
        'ShockwaveFlash.ShockwaveFlash':'Flash',
        'QuickTime.QuickTime':'Quick Time',
        'SWCtl':'Shockwave',
        'WMPLayer.OCX':'Windows Media Player',
        'AgControl.AgControl':'Silverlight'};
    var plugin = null;
    for (var activeKey in activeXNames) {
        try {
            plugin = null;
            plugin = new ActiveXObject(activeKey);
        } catch (e) {
            // do nothing, the plugin is not installed
        }
        pluginString += activeXNames[activeKey] + ',';
    }
    var realPlayerNames = ['rmockx.RealPlayer G2 Control',
        'rmocx.RealPlayer G2 Control.1',
        'RealPlayer.RealPlayer(tm) ActiveX Control (32-bit)',
        'RealVideo.RealVideo(tm) ActiveX Control (32-bit)',
        'RealPlayer'];
    for (var index = 0; index &lt; realPlayerNames.length; index++) {
        try {
            plugin = new ActiveXObject(realPlayerNames[index]);
        } catch (e) {
            continue;
        }
        if (plugin) {
            break;
        }
    }
    if (plugin) {
        pluginString += 'RealPlayer,';
    }
} else {
    for (var i = 0; i &lt; navigator.plugins.length; i++) {
        pluginString += navigator.plugins[i].name + ',';
    }
}
pluginString = pluginString.substring(0, pluginString.lastIndexOf(','));
var plugins = document.createElement('input');
plugins.setAttribute('id', 'pluginList');
plugins.setAttribute('type', 'hidden');
plugins.setAttribute('name', 'pluginList');
plugins.setAttribute('value', pluginString);
form.appendChild(plugins);
var java = navigator.javaEnabled();
var javaEnabled = document.createElement('input');
javaEnabled.setAttribute('id', 'javaEnabled');
javaEnabled.setAttribute('type', 'hidden');
javaEnabled.setAttribute('name', 'javaEnabled');
javaEnabled.setAttribute('value', java);
form.appendChild(javaEnabled);">
<input name="inf_form_xid" type="hidden" value="aba18e7f1bf3f0570fc9f25bb2bd04ee" /><input name="inf_form_name" type="hidden" value="Dermatend
Survey Opt-In" /><input name="infusionsoft_version" type="hidden" value="1.29.10.19" />
<div class="default beta-base beta-font-b" id="mainContent" style="height:100%">
<table cellpadding="10" cellspacing="0" class="background" style="width: 100%; height: 100%">
<tbody>
<tr>
<td align="center" valign="top">
<table bgcolor="#FFFFFF" cellpadding="20" cellspacing="0" class="bodyContainer webFormBodyContainer" width="100%">
<tbody>
<tr>
<td bgcolor="#FFFFFF" class="body" sectionid="body" valign="top">
<div class="text" id="webformErrors" name="errorContent">
</div>
<div>
<div>
<h3>
Still Skeptical? Let us know...
</h3>
<p>
 Fill out our small survey and get a VIP Discount
</p>
</div>
</div>
<div>
<table class="infusion-field-container" style="width:100%;">
<tbody>
<tr>
<td class="infusion-field-label-container">
<label for="inf_field_FirstName">First Name *</label>
</td>
<td class="infusion-field-input-container" style="width:200px;">
<input class="infusion-field-input-container" id="inf_field_FirstName" name="inf_field_FirstName" type="text" />
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table class="infusion-field-container" style="width:100%;">
<tbody>
<tr>
<td class="infusion-field-label-container">
<label for="inf_field_Email">Email *</label>
</td>
<td class="infusion-field-input-container" style="width:200px;">
<input class="infusion-field-input-container" id="inf_field_Email" name="inf_field_Email" type="text" />
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table class="infusion-field-container" style="width:100%;">
<tbody>
<tr>
<td class="infusion-field-label-container">
<label for="inf_custom_Reasonforhesitatingonyourpurchasetoday">Reason for hesitating on your purchase today? *</label>
</td>
<td class="infusion-field-input-container" style="width:200px;">
<select id="inf_custom_Reasonforhesitatingonyourpurchasetoday" name="inf_custom_Reasonforhesitatingonyourpurchasetoday"><option value="">Please select one</option><option value="Scarred it won't work?">Scarred it won't work?</option><option value="Too Expensive?">Too Expensive?</option><option value="Think it might be a scam?">Think it might be a scam?</option><option value="Looking at competition?">Looking at competition?</option></select>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<div style="height:15px; line-height:15px;">
&nbsp;
</div>
</div>
<div>
<div class="infusion-submit" style="text-align:right;">
<button style="" type="submit" value="Submit">Submit</button>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</form>
</body>
</html>

You may find additional help at the Infusionsoft forum. http://community.infusionsoft.com. — Bradley Ullery, Feb 15 '14 at 19:35

score 0 · Answer 1 · answered Feb 14 '14 at 19:17

0

It might help:

$('button').bind('click', function(e){
    if ($('#yourSelect option:selected').val() ==smth){ 
        e.preventDefault();
        var url = "http://stackoverflow.com";
        $(location).attr('href',url);
   }
})

And so on for each option.

answered Feb 14 '14 at 19:17

Y.Puzyrenko

2,166
1
15
23

I tried adding linking to the jquery cdn and adding this code but it isn't working. I think it has something to do that this form send to Infusionsoft first and it's that form that validates and redirects to the final URL. Any Thoughts? – Dee Clay Feb 14 '14 at 20:09

score 0 · Answer 2 · answered Feb 15 '14 at 19:41

The Infusionsoft support folks that say it is not possible are most likely referring to standard functionality.

The Thank you page defined for the web form is called by Infusionsoft after the form has been submitted and the contact created/updated.

There are two options for the thank you page.

Define an Infusionsoft hosted page
Define a custom URL that you manage

The only way to accomplish what you are asking, is to use option #2. For the custom page, you will need to use php, asp, .net, etc. Infusionsoft will send along the contact details in the URL (Id=123). You would then use the Infusionsoft API to query into Infusionsoft to determine which tags (or custom fields) will define the final page you redirect to.

There is no need to use the API for this case. The OP stated they would like to redirect based on the values selected on the form. Values are passed through the query string. This can be used to redirect to the desired page instead of calling the API. — joshmmo, Feb 21 '14 at 21:35

Infusionsoft webform redirect based on drop down selection

2 Answers2