javascript to confirm email, and then allow or prevent form submission

[geoffdude]

Hi all,

Since all the changes here to forms and scripts use in them lately, I can't figure out a solution for form functions via javascript.

Here's what I need, for form:

- Email ID = (text field entry)
- Email Confirm = (cascade text field with email addresses pulled in to check against from uploaded email addresses)
- Email Virtual 1 (pulls in Log emails) = cascade text field that pulls emails from log table .. the LOG TABLE get's written to from EMAIL ID entry via an action

I want a visitor to enter their email, or EMAIL ID,  and then see that email address appear as confirmed in the "Email Confirm" field.  They then can submit the form to get a gift, but once they do their email address goes to a "Email Log" table ... then that log table data is pulled into the "Email Virtual 1" cascade text field .. and if they try to submit the form again the script sees that email address there and prevents the form submission.

I can't get this to work at all.   Any help would be appreciated, thx, Geoff

 

My code:

<script type="text/javascript">
var emailid = document.getElementsByName("InsertRecordemail_id")[0].value;
var confirm = document.getElementsByName("InsertRecordemail_confirm")[0].value;
var vir1 = document.getElementById("cbParamVirtual1").value;


document.addEventListener('BeforeFormSubmit', function(event) {
if (emailid == confirm ) {
  return true; // submit form
}  else if (email == vir1 ){
   alert('You have already submitted the form.');
 event.preventDefault()  // don't submit form because log data has email id in it   
  }
  else
    alert('Your email id is invalid.');
 event.preventDefault()  // don't submit form because confirm email is not valid / not in data email table
});
</script>

 

[AtayBalunbalunan]

Regarding your requirement to prevent form submission, is making the email address field unique in your Log table not suitable for your workflow? Because this will prevent users to submit the form if there is a duplicate. 

[geoffdude]

2 hours ago, AtayBalunbalunan said:

Regarding your requirement to prevent form submission, is making the email address field unique in your Log table not suitable for your workflow? Because this will prevent users to submit the form if there is a duplicate. 

It actually would be unique, and the basis to prevent the submission again, though only AFTER the initial submission.  - Thx

[geoffdude]

OK - I circled back to this last night, and I figured it out. Basically I had to adjust script to adhere to CASPIO structure (which is always in flux) but I got it to work.

 

Here's the solution:

<script type="text/javascript">
document.addEventListener('BeforeFormSubmit', function(event) {
event.preventDefault();

var emailid = document.getElementsByName("InsertRecordemail_id")[0].value;
var emailconfirm = document.getElementsByName("InsertRecordemail_confirm")[0].value;
var email_log = document.getElementsByName("cbParamVirtual1")[0].value;
  
  // checks entered email against email address list table of approved emails, stop submit if there's NO match
     if (emailid !== emailconfirm) {
alert('Sorry, your email is not valid for this offer.');

} 
  // checks if email_id field is empty, stops submit if no email is provided
else if (emailid == "") {
alert('You have not entered an email address.');

}  
  
  // checks entered email against email log of previously submitted emails, stops submit if there IS a match
else if (emailid == email_log) {
alert('You have already requested this offer.');

}
 // submits form and valid email if emailid value and email_confirm value match
else {

document.forms["caspioform"].submit();

}

});
</script>

Also, I had to place some CSS styling in the form to hide the Virtual1 (email_log) field. Like so:

<style>
[name="cbParamVirtual1"] {display:none}
</style>

So there it is. - Request and solution complete.

 

Have a good day all,

 

Geoff