Unchecking all other fields when 'Unsubscribe' checkbox is selected

ameliamarie

Hello all,

I am trying to follow previous posts regarding this topic, and the code that I am testing isn't working correctly. I am attempting to add this code to the header section on the landing page that the form is contained on:

MktoForms2.whenReady(function(mktoForm){
     const formEl = mktoForm.getFormElem()[0];

     const unsubscribeTrigger = "Unsubscribed",
           unsubscribableDeps = [
             "personalBankingOptIn",
             "commercialBankingOptIn",
             "privateBankingOptIn",
             "homeOptIn",
             "economicPerspectivesOptIn",
	     "economicUpdateOptIn",
	     "weekinReviewOptIn",
	     "quarterlyInvestmentNewsletterOptIn",
	     "quarterlyWebConferenceOptIn"
           ];
     
     const dependencies = [
         {
           primaries : unsubscribeTrigger,
           cascadeSecondaries : unsubscribableDeps
             .map(function(unsubscribable){
               return { field : unsubscribable, negate : true, filterPrimaryValues : ["yes"] }
             })
         },
         {
           primaries : unsubscribableDeps,
           cascadeSecondaries : { field : unsubscribeTrigger, negate : true, filterPrimaryValues : ["yes"] }
         }
     ];

     const mktoNegations = {
       "yes" : "no",
       "no" : "yes"
     };

     dependencies.forEach(function(dep){
        if(!Array.isArray(dep.primaries)){
          dep.primaries = [dep.primaries];
        }

        dep.primaries.forEach(function(primary){
          const primaryEl = formEl.querySelector("[name='" + primary + "']");
          
          if(primaryEl){
            primaryEl.addEventListener("click",function(){
              const currentValues = mktoForm.getValues(),
                    primaryValue = currentValues[primary];

              if(!Array.isArray(dep.cascadeSecondaries)){
                dep.cascadeSecondaries = [dep.cascadeSecondaries];
              }

              const mktoFormsObj = dep.cascadeSecondaries
                .filter(function isMatchedPrimary(fieldDesc){
                   return fieldDesc.filterPrimaryValues.indexOf(primaryValue) != -1;
                })
                .filter(function isOnForm(fieldDesc){
                   return fieldDesc.field in currentValues;
                })
                .reduce(function assembleFinal(acc,nextField){                       
                  acc[nextField.field] = nextField.negate ? mktoNegations[primaryValue] : primaryValue;
                  return acc;
                },{});

              mktoForm.setValues(mktoFormsObj);
            });
          }
        });
     });
  });

The landing page is: https://pages.watrust.com/2025-Preference-Center_DRAFT-Preference-Center---Manage-Preferences.html

Can anyone give me any insight on where I'm going wrong? Thank you!

SanfordWhiteman

If you look in your browser console (always start there!) you’ll see this:

That’s because the code isn’t intended to be in <head>. It has to run after the Marketo forms library is loaded. On a Marketo LP, the easiest way to ensure that is to add it just before the closing </body> tag.

ameliamarie

Thank you @SanfordWhiteman I appreciate your help. Would this code work if injected within the LP template versus the page itself?

SanfordWhiteman

Sure, though what I’d typically do is allocate a place for custom JS on the template level:

<div hidden class="mktoText" mktoName="Custom footer JS" id="footerJS"><div>

Then you can paste <script>(s) into that element on the LP level.

It’s up to you, though. If you want the code to run on every page derived from a template, then put the whole script at the template level.

Unchecking all other fields when 'Unsubscribe' checkbox is selected

Unchecking all other fields when 'Unsubscribe' checkbox is selected

Re: Unchecking all other fields when 'Unsubscribe' checkbox is selected

Re: Unchecking all other fields when 'Unsubscribe' checkbox is selected

Re: Unchecking all other fields when 'Unsubscribe' checkbox is selected