Hi Sanford, thanks for the quick response and apologies for my delayed one. Following your advice, I worked on some code using forms 2.0, but I've run into a few issues. I've been learning javascript as I go with this project so this code is an amalgam of the documentation for the vendor we're using as well as the marketo forms 2.0 documentation. I'm using a fetch call to the service, then parsing the email status from the response. Prior to making the call, I am excluding obvious invalid emails ('@gmai.com') as well as null email addresses.
I'm still having issues with the code, particularily with submitting the form when the email address is verified as 'valid'. If I set form.submittable(false); at the beginning of the function, the form doesn't submit, even if the status returns as valid. Additionally, if I put a form.submit(); into the code on a valid email submission, I am seeing the fetch call fire multiple times before throwing the error.
I would appreciate any advice you can provide.
<div>
<script src="//******.marketo.com/js/forms2/js/forms2.min.js"></script>
</div>
<form id="mktoForm_*****"></form>
<div>
<script>
MktoForms2.loadForm("//app-****.marketo.com", "*******", ****, function(form) {
form.onValidate(function(){
form.submittable(false);
var vals = form.vals();
const conditionsArray = [
vals.Email.indexOf("@gmail1.com") >= 0,
vals.Email.indexOf("@gmai.com") >= 0,
vals.Email.indexOf("@gmeil.com") >= 0
]
if (conditionsArray.indexOf(true) === -1 && String(vals.Email) !== ''){
var myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");
myHeaders.append("Authorization", "ApiKey: ******");
var raw = JSON.stringify({
"email": String(vals.Email)
});
var requestOptions = {
method: 'POST',
headers: myHeaders,
body: raw,
redirect: 'follow'
};
//creates a fetch call
fetch("*********************", requestOptions)
.then(response => response.json()) //converts the response to json
.then(data => data.email.status) //parses the email validity from the response
.then(function(status){ //accepts or rejects the form submission based on the status of the email
if (status == 'invalid'){
var emailElem = form.getFormElem().find("#Email");
form.showErrorMessage("The status is invalid, please enter a valid email", emailElem);
}
else if (status !== ''){
form.submittable(true);
form.submit();
console.log('not invalid');
}
else{
console.log('error')
}
})
.catch(function(error){
var emailElem = form.getFormElem().find("#Email");
form.showErrorMessage("There is an error with the server", emailElem);
});
}
else{
var emailElem = form.getFormElem().find("#Email");
form.showErrorMessage("The status is invalid, please enter a valid email", emailElem);
}
});
});
</script>
</div>
.png)