4 Replies Latest reply on Mar 28, 2018 6:53 PM by Lisa Dahlager

    Script For Unchecking Dropdowns In Subscription Center

    Lisa Dahlager

      I found a helpful post in the community sharing a script that automatically checks or unchecks other fields in a subscription center form based on a specific action/click. However, in my subscription center, I use a checkbox for unsubscribing from everything and dropdown fields for subscribing or unsubscribing from the specific topic.

       

      The original script I posted in this post had poor coding in it, but Sandford Whiteman provided a script to solve this problem. See below ...

       

      Message was edited by: Lisa Dahlager

        • Re: Script For Unchecking Dropdowns In Subscription Center
          Sanford Whiteman

          The contribution is definitely appreciated, but please don't do it this way!  It encourages poor coding practices (as does the post you based it on -- you can see my code revisions there as well).

           

          You should use the Marketo Forms 2.0 API to change form values, not generic DOM methods, which will break in all but the most generic form.  You also can't use getElementById when there are multiple forms on a page, among other cases.

           

          Do it like this, assuming your selects use the string "no" as opt-out.

           

          MktoForms2.whenReady(function(form) {
             var masterField = "Unsubscribed",
                dependentFields = [
                   "subscribe_resources__c",
                   "subscribe_blog__c",
                   "subscribe_webinars__c" 
                   /* add more fields as needed */
                ],
                propagateMasterCheckedState = {
                   true : "no", /* value of dependents when master checked */
                   false : ""   /* value of dependents when master unchecked */
                }
          
             /* --- no need to edit below this line --- */
          
             var formEl = form.getFormElem()[0],
                masterEl = formEl.querySelector("[name='" + masterField + "']");
          
             masterEl.addEventListener("click", function(e) {
                var fieldsObj = {};
          
                dependentFields.forEach(function(field) {
                   fieldsObj[field] = propagateMasterCheckedState[this.checked];
                },this);
          
                form.setValues(fieldsObj);
             });
          });
          

           

          Also, option 0 in your selects won't be "NULL" ("NULL" has special meaning on forms and is not added by default) it'll be the empty string.

          1 of 1 people found this helpful
          • Re: Script For Unchecking Dropdowns In Subscription Center
            Sanford Whiteman

            Also, to help you learn the DRY principle in programming, here's how you refactor your original code toward less repetition and more maintainability:

             

            document.getElementById("subscribe_resources__c").selectedIndex = 0;
            document.getElementById("subscribe_blog__c").selectedIndex = 0;
            

             

            simplifies to

             

            document.getElementById("subscribe_resources__c").selectedIndex =
            document.getElementById("subscribe_blog__c").selectedIndex = 0;
            

             

            which simplifies to

             

            [document.getElementById("subscribe_resources__c"),document.getElementById("subscribe_blog__c")] 
              .forEach(function(element){ 
                element.selectedIndex = 0; 
              });
            

             

            which simplifies to

             

            ["subscribe_resources__c","subscribe_blog__c"]
              .forEach(function(id){ 
                 document.getElementById(id).selectedIndex = 0; 
              });
            

             

            which simplifies to (this is specific to how ID attributes work)

             

            ["subscribe_resources__c","subscribe_blog__c"]
              .forEach(function(id){ 
                window[id].selectedIndex = 0; 
              });
            

             

            You can see how with each iteration, there's less repetition, less to type/mistype.

             

            If you're certain you're in the global scope, you can even go further to:

             

            [subscribe_resources__c,subscribe_blog__c]
              .forEach(function(id){ 
                id.selectedIndex = 0; 
              });
            

             

            But I wouldn't do that last one unless you're really sure of the overall code architecture.

            1 of 1 people found this helpful
            • Re: Script For Unchecking Dropdowns In Subscription Center
              Lisa Dahlager

              Thank you very much, Sanford Whiteman. I appreciate the help. I will edit my original post.