Serving different LP's based on a user's form selections | Community
Skip to main content
Brandon_West1
New Participant
February 18, 2019
Solved

Serving different LP's based on a user's form selections

  • February 18, 2019
  • 1 reply
  • 4045 views

Hi - I have a bit of a unique scenario that I have not been able to work out. Within the subscription center, the user has 4 choices (3 subscriptions, 1 unsubscribe). In a nutshell:

  • If user changes or ads a new subscription (net gain of 0 or more), they are served LP A.
  • If user global unsubscribes all (selects unsubscribe option), they are served LP B.
  • (this is the struggle) If users unsubscribes to 1 or more and doesn't add a new subscription (net gain of -1 or more) and doesn't global unsubscribe, they are served LP C

For these different options, I've created a boolean field for each subscription (Y/N) and a datetime stamp (which is an internal requirement) for each. I have trigger campaigns set up to listen for Y/N field changes that apply time stamps.

The advanced form options are too linear for this (1 LP per field option), segments don't seem to update in real time to dynamically swap LP content. Am I overlooking an obvious solution b/c I've been staring at the screen too long?

Thanks in advance!

Brandon

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SanfordWhiteman

The framework would be like so:

MktoForms2.whenReady(function(form){

var formEl = form.getFormElem()[0],

arrayify = getSelection.call.bind([].slice),

subscriptionCheckboxes = formEl.querySelectorAll("input[type='checkbox'][name^='subscription']"),

initialSubscriptionCount = getSubscriptionCount();

form.onSuccess(function(values,thankYouURL){

var thankYouLoc = document.createElement("a");

thankYouLoc.href = thankYouURL;

var netSubscriptionCount = getSubscriptionCount() - initialSubscriptionCount;

/*

netSubscriptionCount - Number, the net difference between previous and current # of subs

values.Unsubscribed - String, "yes"|"no"

Now you can decide Thank You URL based on these (and/or other) factors

and then

document.location.href = "https://example.com/best_fit_thank_you_page" + thankYouLoc.search;

*/

return false;

});

function getSubscriptionCount(){

return arrayify(subscriptionCheckboxes)

.filter(function(sub){

return sub.checked;

})

.length;

}

});

EDIT: While the code above works, realize I didn't heed some of my own Forms API best practices! This is better:

MktoForms2.whenReady(function(form){

var formEl = form.getFormElem()[0],

subscriptionFieldNamePattern = /^subscription/,

initialSubscriptionCount = getSubscriptionCount();

form.onSuccess(function(values,thankYouURL){

var thankYouLoc = document.createElement("a");

thankYouLoc.href = thankYouURL;

var netSubscriptionCount = getSubscriptionCount() - initialSubscriptionCount;

/*

netSubscriptionCount - Number, the net difference between previous and current # of subs

values.Unsubscribed - String, "yes"|"no"

Now you can decide Thank You URL based on these (and/or other) factors

and then

document.location.href = "https://example.com/best_fit_thank_you_page" + thankYouLoc.search;

*/

return false;

});

function getSubscriptionCount(){

var currentValues = form.getValues();

return Object.keys(currentValues)

.filter(function(field){

return subscriptionFieldNamePattern.test(field);

})

.filter(function(subscriptionField){

return ["yes","true"].some(function(truthy){

return currentValues[subscriptionField] == truthy;

});

})

.length;

}

});

This snippet assumes you'll maintain the naming convention where the subscription-related fields begin with "subscription". If not, you'll have to maintain that collection in more of a hard-coded way.

1 reply

SanfordWhiteman
New Participant
February 18, 2019

This is trivially done in the onSuccess using the Forms 2.0 JS API. But without looking at your actual form it isn't possible to give you detailed pointers.

Brandon_West1
New Participant
February 18, 2019

Thanks for responding so quickly @Sanford Whiteman - a working example of the form can be seen here.

The fields are checkboxe type with options like the following:

I'm not that familiar w/ the onSuccess function - any direction would be appreciated.

SanfordWhiteman
SanfordWhitemanAccepted solution
New Participant
February 18, 2019

The framework would be like so:

MktoForms2.whenReady(function(form){

var formEl = form.getFormElem()[0],

arrayify = getSelection.call.bind([].slice),

subscriptionCheckboxes = formEl.querySelectorAll("input[type='checkbox'][name^='subscription']"),

initialSubscriptionCount = getSubscriptionCount();

form.onSuccess(function(values,thankYouURL){

var thankYouLoc = document.createElement("a");

thankYouLoc.href = thankYouURL;

var netSubscriptionCount = getSubscriptionCount() - initialSubscriptionCount;

/*

netSubscriptionCount - Number, the net difference between previous and current # of subs

values.Unsubscribed - String, "yes"|"no"

Now you can decide Thank You URL based on these (and/or other) factors

and then

document.location.href = "https://example.com/best_fit_thank_you_page" + thankYouLoc.search;

*/

return false;

});

function getSubscriptionCount(){

return arrayify(subscriptionCheckboxes)

.filter(function(sub){

return sub.checked;

})

.length;

}

});

EDIT: While the code above works, realize I didn't heed some of my own Forms API best practices! This is better:

MktoForms2.whenReady(function(form){

var formEl = form.getFormElem()[0],

subscriptionFieldNamePattern = /^subscription/,

initialSubscriptionCount = getSubscriptionCount();

form.onSuccess(function(values,thankYouURL){

var thankYouLoc = document.createElement("a");

thankYouLoc.href = thankYouURL;

var netSubscriptionCount = getSubscriptionCount() - initialSubscriptionCount;

/*

netSubscriptionCount - Number, the net difference between previous and current # of subs

values.Unsubscribed - String, "yes"|"no"

Now you can decide Thank You URL based on these (and/or other) factors

and then

document.location.href = "https://example.com/best_fit_thank_you_page" + thankYouLoc.search;

*/

return false;

});

function getSubscriptionCount(){

var currentValues = form.getValues();

return Object.keys(currentValues)

.filter(function(field){

return subscriptionFieldNamePattern.test(field);

})

.filter(function(subscriptionField){

return ["yes","true"].some(function(truthy){

return currentValues[subscriptionField] == truthy;

});

})

.length;

}

});

This snippet assumes you'll maintain the naming convention where the subscription-related fields begin with "subscription". If not, you'll have to maintain that collection in more of a hard-coded way.