Detect status of native form validation before running custom validation

[JPieper]

I'm working with some form embeds that have Global Validation Rules applied that restrict which email domains are allowed to submit the form. This is working as it should.

We'd like to use an email verification service's API as a second layer of validation on these forms only on the addresses that make it past the Global Validation Rules. I have this setup using the onValidate method but it fires every time, even if the email address doesn't validate with the Global Validation Rules.

Is there any way to run custom validation only after all other validations have passed? Thanks!

[SanfordWhiteman]

Of course. The arg passed to onValidate is a Boolean indicating whether native validation passed or not.

[JPieper]

Thanks! I've tried checking this arg but it's not behaving as expected. Here's my JS:

MktoForms2.whenReady( function(form) {  
        form.onValidate(function(mktoValidate) {
            var vals = form.vals();
            console.log(mktoValidate);
            if(!mktoValidate) { 
                console.log("Did not pass validation.")
                return;
            }
        });
    });

If I input some non-numeric characters into the phone number field and hit submit, console.log(mktoValidate) prints false into the console as expected.

However, if I enter an email address into the Email field that contains a domain restricted by the global form validation rules, it shows the error message for that field, prevents the form submit, but mktoValidate is true.

Did I miss a step or misunderstand this?

[SanfordWhiteman · Accepted solution]

Yep, you're misunderstanding the order of operations. The onValidate event is for JS validation. Global Form Validation is a server-enforced rule. It only fires after the form has been submitted (on the wire) to Marketo.