Limit Email Domains on Form Submission

[Jon_Jagelsky]

We used the java script from this article on all of our landing pages with 1.0 forms in order to block personal email domains but in testing I'm finding that this same script does not work with new forms 2.0.

https://community.marketo.com/MarketoResource?id=kA650000000GtqvCAC

Anyone else running into this same issue or have any suggestions on how to block email domains with Forms 2.0?

[Kathi_Gosche]

I have run into this issue as well. In fact, that's why I came into the Community today.

[Alok_Ramsisaria]

First drag and drop the form to the landing page draft and then add the JS to the HTML box, which is to be dropped on the landing page. The JS needs to be added in the landing page draft in the HTML box of the editor.

[Kathi_Gosche]

That's the same code I've been using with 1.0 forms and it worked great. However it doesn't seem to work at all with 2.0 forms.

[Halid_Delkic]

We’re experiencing the same issue since switching over to forms 2.0.

Tried dragging/dropping the form first, followed by the JS, but the block isn’t working as it did on forms 1.0.
 
Would be interested to hear if anyone has discovered an alternative method.

[Kathi_Gosche · Accepted solution]

One of my developers came up with this code that has worked for me. Depending on the way your button is designed, it may or may not work for you, but you can give it a try.

Replace your old validation code with the below:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script type="text/javascript" charset="utf-8">

var $jQ = jQuery.noConflict();

var invalidDomains =

[

"hotmail.com",

"yahoo.com",

"aol.com",

"gmail.com",

];

$jQ(document).ready(function(){

if ($jQ('.mktoButtonRow').length == 0) {

window.setTimeout(function(){

emailValidation();

}, 500);

} else {

emailValidation();

}

});

$jQ('#Email').bind('blur', function(){

if (isEmailValid()){

var $error = $jQ(this).parent().find('.mktoError');

if ($error.length > 0) {

$error.fadeOut(200, function(){

$error.remove();

$jQ('#Email').removeClass('mktoInvalid');

});

}

}

});

function emailValidation() {

var $buttonRow = $jQ('.mktoButtonRow');

var submitText = $buttonRow.find('button').html();

var $replacement = $jQ('<input id="replacementButton" type="button" class="mktoButton" value="' + submitText + '" />');

$buttonRow.hide();

var buttonRowContents = $buttonRow.html();

$span = $jQ(buttonRowContents).html('');

var $replacementRow = $jQ('<div class="mktoFormRow" />').append($span.append($replacement));

$jQ('.mktoFormRow :last').after($replacementRow);

$jQ('#replacementButton').click(function(){

console.log('debug1');

if (!isEmailValid()) {

console.log('debug2');

var $error = $jQ('#Email').parent().find('.mktoError');

if ($error.length == 0) {

$error = getError('Please provide a business or institutional email address');

$jQ('#Email').after($error);

}

$error.fadeIn(200);

$jQ('#Email').removeClass('mktoInvalid').addClass('mktoInvalid');

return;

} else {

console.log('debug3');

$jQ('.mktoButtonRow button').trigger('click');

}

});

}

function isEmailValid() {

var email = $jQ('#Email').val().toLowerCase();

for(i=0; i < invalidDomains.length; i++) {

var invalidDomain = invalidDomains[i].toLowerCase();

if (email.indexOf(invalidDomain) !== -1) {

return false;

}

    }

return true;

}

function getError(message, detail) {

var $container = $jQ('<div class="mktoError" style="right: 0px; bottom: -47px; display: none" />');

var $arrow = $jQ('<div class="mktoErrorArrowWrap"><div class="mktoErrorArrow"></div></div>');

var $errorMessage = $jQ('<div class="mktoErrorMsg" />').html(message);

if (typeof detail == 'string' && $jQ.trim(detail) != '') {

$errorMessage = $errorMessage.append($jQ('<span class="mktoErrorDetail" />').html(detail))

}

return $container.append($arrow).append($errorMessage);

}

</script>

[Anonymous]

Do you know if this code should be on the landing page template (in the Design Studio) or should it be on the landing page itself? Or does it not matter? Thank you,

--Regan

[Kathi_Gosche]

I have it placed on the landing page itself. I haven't tried it in a template, but that might work fine too. If you try it, I would be interested to hear how it worked out.

[Jon_Jagelsky]

That worked great! Thank you so much Kathi
 

Wish i had developer like that in-house 🙂 

[Kathi_Gosche]

Glad it worked for you Jon. Enjoy.