SOLVED

Restrict Free Email for Form Submission

Go to solution
Emma_Wu1
Level 1

Restrict Free Email for Form Submission

Hi, I have found the javascript provided on the Marketo Developer documentation about restricting free email(like gmail.com, yahoo.com etc.) upon form submission. However, when I inserted the script before the end of head card, and tested the form, it didn't work as it should.

Can someone let me know where I did wrong, the place I inserted the code, or I need to clear up the form CSS custom code?(which I did, but still didn't work) or something else?

Thank you!

Here's the script:

<script>
(function (){
  // Please include the email domains you would like to block in this list
  var invalidDomains = ["@gmail.","@yahoo.","@hotmail.","@live.","@aol.","@outlook."];
  MktoForms2.whenReady(function (form){
   form.onValidate(function(){
   var email = form.vals().Email;
   if(email){
   if(!isEmailGood(email)) {
   form.submitable(false);
   var emailElem = form.getFormElem().find("#Email");
   form.showErrorMessage("Must be Business email.", emailElem);
  }else{
   form.submitable(true);
  }
  }
  });
  });
 
  function isEmailGood(email) {
   for(var i=0; i < invalidDomains.length; i++) {
   var domain = invalidDomains[i];
   if (email.indexOf(domain) != -1) {
   return false;
  }
  }
   return true;
  }
})();
</script>

Here's the source I get the code from:

http://developers.marketo.com/blog/restrict-free-email-domains-on-form-fill-out/

Here's the test landing page and form:

http://get.evault.com/Testing-Business-Email-Error-Msg_ttest.html

Appreciated any feedback!

1 ACCEPTED SOLUTION

Accepted Solutions
SanfordWhiteman
Level 10 - Community Moderator

Re: Restrict Free Email for Form Submission

If you look in your browser console you'll see the error: you're trying to call MktoForms2.whenReady before the forms library (forms2.min.js) is loaded.

On Marketo LPs, the library can be loaded square in the middle of the page. So you can't put your code in <head> as you've done here (nor can you put it high up in <body>) or it won't have enough to work with.

Instead, move your <script> block down to right before the closing </body> tag.

View solution in original post

7 REPLIES 7
SanfordWhiteman
Level 10 - Community Moderator

Re: Restrict Free Email for Form Submission

If you look in your browser console you'll see the error: you're trying to call MktoForms2.whenReady before the forms library (forms2.min.js) is loaded.

On Marketo LPs, the library can be loaded square in the middle of the page. So you can't put your code in <head> as you've done here (nor can you put it high up in <body>) or it won't have enough to work with.

Instead, move your <script> block down to right before the closing </body> tag.

View solution in original post

Emma_Wu1
Level 1

Re: Restrict Free Email for Form Submission

Thank you Sanford!

One another quick question, should I clear up all the Custom CSS code from the form customize wizard in order to make this script working?(we have some previous script written in there to prevent free email on form submission)

Thanks!

Emma

SanfordWhiteman
Level 10 - Community Moderator

Re: Restrict Free Email for Form Submission

Well, CSS isn't having a direct impact here. Certainly, other JavaScript could have a fatal impact.

Anonymous
Not applicable

Re: Restrict Free Email for Form Submission

Hi Sanford,

Thanks for your insight here and on other threads related to this topic. I have a question for you - how would this work with forms embedded on non-Marketo landing pages?

Best,

Erika

SanfordWhiteman
Level 10 - Community Moderator

Re: Restrict Free Email for Form Submission

The same, just make sure you put the <script> in the right place as noted in my Correct answer.

LijuMathew
Level 1

Re: Restrict Free Email for Form Submission

Hi Sanford,

 

We are looking to restrict personal email IDs from being entered on a non-Marketo landing page. The script works well when put on non-Marketo individual landing pages. However, when we put the script on a global basis on our website, certain page layouts are getting broken.

Is there a script that we can deploy once at the global website level, which gets applied to all the pages at once?

 

Regards,
Liju

SanfordWhiteman
Level 10 - Community Moderator

Re: Restrict Free Email for Form Submission

You can use FormsPlus::Email Pattern (download v1.0.3 from here and upload to your Design Studio).

 

Demo of usage here: https://codepen.io/figureone/pen/85b9839557e2b684cc22a2b552a67bcb

 

However,  there's nothing in the code above — broken as it is — that would affect layout. (Nor is there any such code in FormsPlus:: Email Pattern.) They just change behaviors, not styles.