28 Replies Latest reply on Jul 25, 2018 2:49 PM by Sanford Whiteman

    Form field conditional on current vlaue

    Amber Hobson

      Is there a way for a form field to show up based on another field in our Marketo instance? We want to have a checkbox on our forms, but we only want it to appear if it has not already been checked. I've been searching everywhere on how to do this but can't find anything. Is there any way that I can do this? Thanks!

        • Re: Form field conditional on current vlaue
          Sanford Whiteman

          Is there a way for a form field to show up based on another field in our Marketo instance? We want to have a checkbox on our forms, but we only want it to appear if it has not already been checked.

          These are 2 different concepts:

           

          • Show/hide a field based on another field's value
          • Show/hide a field based on its own value

           

          Which one are you actually trying to do?

          • Re: Form field conditional on current vlaue
            Keith Nyberg

            Sounds like Amber Hobson is trying to only show the boolean field when the system value is NULL/False. I know you can execute this with JS, but for non-coders this is always a tough solution. And to Amber's point, OOB you cannot control visibility rules for a field based on the same field's DB values (you can for another field).

             

            One solution that I have built/tested recently and have been meaning to share is written below.

             

            Create a new custom field of the same type as the original field. Add "Visibility Rule" to the end of the name or something similar so its easily identifiable. Then create 2 smart campaigns to manage the visibility field when the core field changes. Like this... When core field is marked TRUE, update visibility rule field to TRUE. And the opposite. When core field is changed to FALSE, update visibility rule field to FALSE. Once this is done, you'll need to batch update the visibility rule field to match the core field for our existing database. Now on the form, add both fields and make the visibility rule field hidden (allow pre-fill). Then add a form visibility rule to the core field to only show the core field when the visibility field is FALSE.

             

            This makes it so the core boolean field is only shown on the form when the visibility field is FALSE. And thus, allows you to show/hide the field based on the system value of the same field.

             

            Caveats:

            - Based on how fast your smart campaigns are running, the field may not remove from the form immediately.

            - Field will still show if cookies are cleared or user visits your site on a new machine.

            - Requires you to duplicate a field which isn't ideal and can be confusing if not given an intuitive name.

             

            I know i'll catch some flak from the people who are JS proficient (cough Sanford Whiteman) but for me, this solution was easy to implement and required no JS.

             

            Let me know what you think of this solution!

              • Re: Form field conditional on current vlaue
                Sanford Whiteman

                Then create 2 smart campaigns to manage the visibility field when the core field changes. Like this... When core field is marked TRUE, update visibility rule field to TRUE. And the opposite. When core field is changed to FALSE, update visibility rule field to FALSE. Once this is done, you'll need to batch update the visibility rule field to match the core field for our existing database.

                If anything, this is the part that is easier to manage on the client via JavaScript.

                 

                I understand the appeal of (and fully support) using the built-in VR logic as opposed to reproducing all that logic in code, if you're not a coder.

                 

                But the above is a ton of work to just get a hidden field to have the same value as the visible field on the form.  You can do this in one line of JavaScript, and no need for a Smart Campaign:

                 

                form.setValues({ hiddenFieldForVisibilityRule : form.getValues().visibleCheckboxField });
                
                2 of 2 people found this helpful
                  • Re: Form field conditional on current vlaue
                    Grégoire Michel

                    The advantages of doing in a JS line of code are:

                    • That you are 100% sure that the values remain in sync in Marketo, whatever delay happens on your smart campaigns.
                    • In the activity log, the hidden field will be part of the "filled out form" activity, with timestamp and IP address, which might be very useful in case of audit (remember the GDPR need for an audit trail).

                     

                    We usually use that same technique to set the opt-out field based on the opt-in field.

                     

                    -Greg

                    • Re: Form field conditional on current vlaue
                      Tom Liolios

                      Sanford Whiteman I'm trying to achieve the following with my Marketo forms:

                      • Show/hide a field based on its own value

                       

                      You say the following JS would make this work:

                      form.setValues({ hiddenFieldForVisibilityRule : form.getValues().visibleCheckboxField });

                       

                       

                      As I'm a non-coder, could you explain how and where to add this line of code? I assume in the "edit custom CSS" part of the form?

                      And how should I adjust the line of code so that it refers to field X and Y and not to field Z?

                       

                      Thanks a lot for your help! Would be great if we could achieve this without a cumbersome smart campaign.

                      - Tom

                        • Re: Form field conditional on current vlaue
                          Sanford Whiteman

                          As I'm a non-coder, could you explain how and where to add this line of code? I assume in the "edit custom CSS" part of the form?

                          Nope, it's JavaScript, so you should put it in a separate <script> block.  You can put the <script> before the closing </body> tag on a Marketo LP, or right after the embed code on a non-Marketo LP.

                           

                          <script>
                          MktoForms2.whenReady(function(form){
                            form.setValues({ 
                              hiddenFieldForVisibilityRule : form.getValues().visibleCheckboxField 
                            });
                          })
                          </script>
                          

                           

                           

                          And how should I adjust the line of code so that it refers to field X and Y and not to field Z?

                          Replace "hiddenFieldForVisibilityRule" and "visibleCheckboxField" with the real field names on your form.

                           

                          You can use your browser's F12 Inspector to get the field names.

                          1 of 1 people found this helpful
                            • Re: Form field conditional on current vlaue
                              Tom Liolios

                              Hi Sanford,

                              Many thanks for helping out. I'm gonna add the JS this week, and test it out. Hope it works!

                              Best,

                              Tom

                              • Re: Form field conditional on current vlaue
                                Yun Bai

                                Hi Sanford,

                                 

                                Thank you for sharing such a great solution. I understand the logic and the js code which will capture the value from the "visibleCheckboxField" combined with 2 SCs. However, for our case, we will show the "hiddenFieldForVisibilityRule" -- "Opt-in" field, when leads only select any EU countries. So "Country" will be our  "visibleCheckboxField". In this case, I can't create the smart campaign to capture "T/F" value which will alter the value of "Opt-in" field. The goal here is we would like to not show "opt-in" field on the form, when the lead already opted in. And I can't do  "visibleCheckboxField" and "hiddenFieldForVisibilityRule" both are the same "opt-in" field. Do you have any suggestion for our case? I was trying Dan's solution, haven't got succeed yet. 

                                 

                                Best,

                                Becky

                                • Re: Form field conditional on current vlaue
                                  Lucho Soto

                                  Hi Sanford Whiteman, looking to implement this code across our forms. I tried incorporating the line of code you mentioned but wasn't sure how to make it work in conjunction with the onsuccess handler we already have in place. I tried implementing the code below, but I get a "form is not defined" error when I try to debug.   

                                   

                                  Any feedback would be super helpful.                               

                                   

                                  <script src="//app-sj04.marketo.com/js/forms2/js/forms2.min.js"></script>
                                                              <form id="mktoForm_1611"></form>
                                                              <script>MktoForms2.loadForm("//app-sj04.marketo.com", "***-***-***", 1611);</script>
                                                              <script>
                                                                    MktoForms2.whenReady(function (form){
                                  form.setValues({ 
                                      COptInDate : form.getValues().COptin 
                                    });
                                  })
                                                                       //Add an onSuccess handler
                                                                      form.onSuccess(function(values, followUpUrl){
                                                                          dataLayer.push({
                                                                              'event': 'contactushomeform',
                                                                              'eventCallback' : function () {       
                                                                                  form.getFormElem().hide();
                                                                                  document.getElementById('confirmcontacthome').style.visibility = 'visible';
                                                                              }
                                                                          });
                                                                          return false;
                                                                      });
                                                                                              </script>
                                  
                          • Re: Form field conditional on current vlaue
                            Dan Stevens

                            We do this with our "opt-in" process.  The approach we use sounds very similar to what Keith suggested - and is part of a post I shared back in December 2016: Re: Opt-in field checkbox on Form.  I'll re-explain some of it here.

                             

                            We have multiple fields (for auditing purposes) that are related to the boolean opt-in field: opt-in date, opt-in program, opt-in programID, etc.  It's also important to note that boolean fields in Marketo do not contain "NULL/TRUE" values.  They contain "FALSE/TRUE" values - which means there is ALWAYS a value for boolean fields - even for "unchecked" fields.  Sanford did a good job explaining this in a prior discussion (Block field updates is preventing a checkbox from being checked (has never contained a value)).

                             

                            Any time someone opts-in via our forms, we have a trigger campaign to date-stamp them AND associate the program that was responsible for that:

                             

                             

                            On our forms, we include the "opti-in-date" field as a hidden field (with pre-fill turned on) - this is what Keith referred to as the need for another custom field.  If a date exists - meaning, the lead has opted in at some point in the past - we hide the opt-in field from the form:

                             

                             

                            In addition - we also include this smart campaign to ensure the value stays persistent (e.g., the user had already opted-in in the past, but didn't check the opt-in checkbox the second time he/she filled out a form):

                             

                             

                            Of course, every one of our emails includes the option for anyone to opt-out/unsubscribe - and this supersedes all of this for future email sends.

                             

                            The reason why the last/additional steps are necessary (keeping the field persistent) - and another caveat to add to your solution, Keith - is because Marketo doesn't natively support form pre-fill on embedded forms on our website - so the main process only works on native Marketo landing pages.

                             

                            Sanford - does your simplified js approach work on forms embedded on non-Marketo LPs?

                              • Re: Form field conditional on current vlaue
                                Grégoire Michel

                                Hi Dan,

                                 

                                The line of code that keeps the field in sync can easily be added to your Form JS, in the "On submit" event.

                                 

                                -Greg

                                  • Re: Form field conditional on current vlaue
                                    Dan Stevens

                                    Hi Greg - the js that Sanford provided is to just keep the "other" field in sync with the opt-in field.  It's not a replacement for the process I've illustrated here.  And like I mentioned above, this process only works (using functionality within the UI) with Marketo LPs, not forms embedded on our website.  It would be interesting to see the full js code to accomplish this with embedded forms (hiding the field if the field is not empty; or if opt-in date exists) - vs. having to use a smart campaign to keep the values persistent.

                                      • Re: Form field conditional on current vlaue
                                        Grégoire Michel

                                        Hi Dan,

                                         

                                        There are 2 issues, in fact.

                                        • Keeping the fields sync'ed, whether the field is your "Avanade Opt-in Date", the "Unsubscribe" field or any other field. For this, Sanford's JS is, IMHO, the best technique
                                        • Being able to prefill the hidden field that serves as a controller for the opt-in field visibility even on embedded forms outside of Marketo LP's, as you point out. This is a "Non Marketo LP prefill issue" and the best person to answer this Sanford Whiteman

                                         

                                        -Greg

                                          • Re: Form field conditional on current vlaue
                                            Sanford Whiteman

                                            A full-fledged embedded PreFill solution will certainly fix this.

                                             

                                            But also consider one quirk about Marketo checkbox fields: if a checkbox is in your Progressive Profiling section, it will always be shown until it is checked. ProgPro logic does not support "intentionally left blank" fields; they are considered the same as unfilled fields.

                                             

                                            So if you're willing to have that checkbox be counted in your ProgPro max fields (or if you're not otherwise using ProgPro at all) this is another way to conditionally show a field w/this particular datatype.

                                              • Re: Form field conditional on current vlaue
                                                Amber Hobson

                                                So, I love the discussions! But I want to make sure that I'm reading this correctly since for my purposes, this may fix everything. Since this is a progressive form (embedded on our site), the field will show up no matter what as long as it remains unchecked? We don't have any other checkbox type fields on our progressive forms, so I didn't know that was how those work. That may make my life a lot easier since it will always appear at the top. I understand that cookies and other items can cause it to reappear later, but for those that have filled out a lot of our forms, that field won't show up once they have checked it the first time? And until they check it, it will always show up?

                                                  • Re: Form field conditional on current vlaue
                                                    Sanford Whiteman

                                                    the field will show up no matter what as long as it remains unchecked?

                                                    Correct. Outside of the Progressive Profiling block, checkbox fields (in Marketo-land forms, not on standard HTML forms) can have the 2 values "yes" or "no." But in the ProgPro block, "no" is considered empty. So as long as the Boolean field remains false on the server, that field will always be shown on the form.

                                                    3 of 3 people found this helpful
                                          • Re: Form field conditional on current vlaue
                                            Grégoire Michel

                                            I like this idea of using the Opt-in date as a controller for the opt-in field visibility, BTW. If you sync the Unsubscribe field with the Opt-in one, you can also use the Unsubscribe field as a controller.

                                             

                                            -Greg

                                            • Re: Form field conditional on current vlaue
                                              Yulia Novozhilova

                                              Hi Dan,

                                               

                                              If I am reading this correctly... you overwrite the opt in program with latest program even though the checkbox value was hidden (opt in date exist)? Wouldn't you want to have the original opt in program tracked even though someone fills out multiple forms, or am I missing something?

                                              • Re: Form field conditional on current vlaue
                                                Yun Bai

                                                Hi Dan,

                                                 

                                                Thank you for the idea. I am curious and not clear about how does Marketo will capture a hidden field value. Let's say, existing Lead A has "email consent last update" date/time value "05/23/2018 4:18 PM". I added this "email consent last update"  field as a hidden field on the form, choose "Get value from default" value. However, I leave "Default value" empty. I assume Marketo will capture the value as a empty string, or no or null? How can Marketo grab the real date/time value from lead record?

                                                 

                                                 

                                                 

                                                Another issue I encountered is

                                                - when I filling out form on google chrome browser, by using an existing lead email or a new test email, the hidden field always not show up.

                                                - when I filling out form on incognito, by using an existing lead email or a new test email, the hidden field always show up...

                                                 

                                                Could you advice that why this happened?

                                                 

                                                Thank you,

                                                Becky