Opt-in checkbox for Progressive Profiling Form

[Anonymous]

Hi all,

I'm trying to get an opt-in checkbox to appear as the last item of a progressive profiling form on this Nokia page. Does anyone have any recommendations to do this? It's set up so that if country selected is Canada, the checkbox is not ticked by default.

Cheers

Hakim

[Anonymous]

Hi Hakim,

Could you be more specific about what the problem is?

I don't see the form on that page, by the way.

Denise

[SanfordWhiteman]

I agree, I don't see a Marketo form there.

[Anonymous]

Sorry: See my post below for correct URL and better explanation

[SanfordWhiteman]

Quite simple:

MktoForms2.whenReady(function(form){
  var formEl = form.getFormElem()[0],
  inputRows = formEl.querySelectorAll('.mktoFormRow'),
  buttonRow = formEl.querySelector('.mktoButtonRow'), 
  optInRow = [].filter.call(inputRows,function(itm){ return itm.querySelector('INPUT#mktoOptin');}).shift();
  formEl.insertBefore(optInRow,buttonRow);
});

I'm uncomfortable with the way you're managing the checkbox value.  You should use Forms 2.0 API setValues/getValues as much as possible or it's not guaranteed to continue to work (though it does work now).

[Anonymous]

Thank you Sanford Whiteman​, Dory Viscogliosi​ and Denise Greenberg​ for your help on this. I'm going to try out Sanford's recommendation and get back to you all in a few days. If this works I'll be sure to mark it correct and distribute my knowledge to the rest. As you can imagine, I took over this Marketo instance and these forms were already created. I wasn't satisfied with having the checkbox at the top and now that you've mentioned this I'll go take a look for sure!

Cheers

Hakim

[Anonymous]

Terribly sorry. Accidental character add to URL. This should be the URL: https://pages.nokia.com/1255.Bank-of-the-future.html​

To explain further, when building the form, the checkbox at the top that allows people to opt into receiving communications is dependent on the value they select for country. If it's Canada, by default, the box is unchecked (due to Canadian Anti-Spam Law). For every other country, this box is ticked by default. My issue is that due to the nature of the way forms are built in marketo, I can't drag this box to the bottom (right before the submit button but outside of the form). It works if it is placed at the top but when at the bottom, it acts as if it's part of the progressive form and won't display. 

Hope this clarifies my question a bit.

2299065421

[Dory_Viscoglio]

Ah, Sanford Whiteman​ might have some fancy code to bring that field down even though it's involved in progressive profiling. But, that is one reason I dislike some of Marketo's progressive profiling functionality.

You could also have a field that is shown conditionally based on existing field values (sort of a progressive profiling hack).

[Anonymous]

Hi Hakim,

Thank you for the clarification. As you have found, you can't put a "regular" field below the progressive profiling fields by dragging it. This might be possible to do with special code (as Dory suggests) and I've just sent a note to my coding expert to ask.

I wasn't aware that you could cause a checkbox to be checked or unchecked based on the value in another field. How are you doing this? And is it definitely working? When I selected Canada on your form the Opt-in Checkbox remained unchecked.

The only way I can think of to make the checkbox pre-checked for Canada but not for other countries is to create a second field for that purpose - Opt-In for Canada, for example. Then use visibility rules so that if Canada is chosen for Country, the pre-checked Opt-In for Canada field is displayed. And if any other country is chosen, the regular Opt-In field (not pre-checked) appears. And then use a triggered campaign to copy the value from the Opt-In Canada field to the regular Opt-In field.

Denise

[SanfordWhiteman]

Denise, using basic JS it's simple to link the state of a checkbox to the value of a select. The current code on Hakim's site is a bit more generic than I'd like, but there's no need for separate server-side fields (nor even *any* server-side fields, since the checkbox can be in a rich text area).