Would like to require TWO attempts to write email address that MUST Match

[Dirty Butter]

I would like to be able to verify email addresses on even a basic level. So AGAIN today, I had a customer write and I replied - and it bounced because the email address doesn't exist. The customer of course will figure we're not helpful or that our site is dead - and won't be back!

It just doesn't seem like it would be that hard to setup a required match for email addresses much like passwords have to be input identically twice before being accepted.

Anyone able to help with this?

[havenswift-hosting]

Is the github issue still open and if so can you add a reference to it in this thread ?  I also think this is important and should be in core and hopefully @Al Brookbanks will see this thread and try to add it very soon or alternatively, if anyone can supply a solution then that would be easier for Al to add.

Ian

[bsmither]

Please try this.

For the stock Foundation skin:

In the file content.register.php, near line 27, find:

   <div class="row">
      <div class="small-12 large-8 columns"><label for="email" class="show-for-medium-up">{$LANG.common.email}</label><input type="text" name="email" id="email" value="{$DATA.email}" placeholder="{$LANG.common.email}  {$LANG.form.required}" required ></div>
   </div>

On a new blank line AFTER, add:

{* NEW Confirm Email *}
   <div class="row">
      <div class="small-12 large-8 columns"><label for="emailconf" class="show-for-medium-up">Confirm Email</label><input type="text" name="emailconf" id="emailconf" value="" placeholder="Confirm Email  {$LANG.form.required}" required ></div>
   </div>
{* END NEW *}

At the end of this file, on a new blank line, add:

{* NEW Validate Confirm Email Message *}
<div class="hide" id="validate_email_mismatch">"Email mismatch"</div>
{* END NEW *}


In the file 3.cubecart.validate.js, near line 385, find:

    $("#registration_form").validate({

Finding this just makes sure we are in the Registration Form page.

Near line 406, find:

            phone: {
                required: true,
                phone: true
            },

On a new blank line ABOVE, add:

/* NEW Validate Confirm Email Match */
            emailconf: {
                equalTo: "#email"
            },

About 30 lines later, find:

            phone: {
                required: $('#validate_phone').text(),
                phone: $('#validate_phone').text()
            },

On a new blank line ABOVE, add:

/* NEW Validate Confirm Email Match */
            emailconf: {
                required: $('#validate_email_mismatch').text(),
                equalTo: $('#validate_email_mismatch').text()
            },

The above is for a stock Foundation skin. Other skins based off of CubeCart's Foundation should also work but may have other line numbers. This is a javascript solution copied from the Password Confirmation functionality.

Because a page resource has changed (the javascript file), and browsers typically cache page resources, you must force the browser to reload all page resources.

Other skins (third-party and CubeCart's CC5 skins) may or may not have a jquery validate plugin available. So, be sure to include this plugin where CC5 skins can get it (in CubeCart's /js/plugins/ folder).

If adding a jquery validate plugin is not feasible, or if the browser is not running javascript or javascript has crashed, then we must rely on controller code to make sure the registration data is managed. Again, I copied the passconf code to work with emails.

In /classes/user.class.php, find the registerUser() function. Should be near line 696 for CC6012.

Find:

		//Validate email
		if (!filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL)) {
			$GLOBALS['gui']->setError($GLOBALS['language']->common['error_email_invalid']);
			$error['email'] = true;

On a new blank line AFTER, add:

/* NEW Validate Email */
		} elseif ($_POST['email'] !== $_POST['emailconf']) {
			$GLOBALS['gui']->setError("Email and Confirm Email do not match!");
			$error['email'] = true;
/* END New */

 

This is a solution for the highest priority (IMHO) location - the new user Registration form.

Of a slightly lower priority is the Checkout Confirm page where a "ghost" customer can make a purchase. I will have to double-check if a "ghost" customer causes CubeCart to use the User->registerUser() function, but I think no. I think a "ghost" will use the User->createUser() function.

At low priority is: Profile page (changing email address), Contact Us page, and Recover Password page.

[Dirty Butter]

1 hour ago, havenswift-hosting said:

Is the github issue still open and if so can you add a reference to it in this thread ?  I also think this is important and should be in core and hopefully @Al Brookbanks will see this thread and try to add it very soon or alternatively, if anyone can supply a solution then that would be easier for Al to add.

Ian

I reworded my original post soon after writing it, as I went to add the GitHub request link and couldn't. I did find where I had commented on one, but it was only partially related to this problem.

Thank you for the code, @bsmither. I'll work on it tomorrow. But oddly enough the place we find this most maddening is the very Contact Us page that you considered to be low priority. We do sometimes get orders where the emails bounce, but I can usually look at their PayPal email and see the typo they made. And I can mail the package, even if we don't have a good email address.

But with non-customers who are writing to us - we are completely unable to proceed. Our free Search Service is a major part of our marketing strategy and where many of our future customers first interact with us.

[bsmither]

In the meantime, please consider adding special content to the Contact Form, Content tab.

Make the text bigger, bolder, and maybe in red.

Make sure your contact info is correct!

[Al Brookbanks]

I don't recall the GitHub issue but it's probably buried deep in the ones tagged as feature request.

Im not sure if anyone else has noticed but confirming email address seems to be going out of fashion. Less sites seem to do this. Maybe due to auto fill becoming more common??

Maybe a cool solution would be to request confirmation if say three characters or more are typed and not if less were. This way it may detect if it's auto filled or not.

[Dirty Butter]

People asking for our help to find toys (and then giving a wrong email address) has been an issue for many years, since we started our free plushmemories.com site in 2005. I DID have big bold red font to impress on them that I could not help if they did not give me a valid email address, so your suggestion, Bsmither, is a good one that I will implement on the store.

As for circumventing confirmation if it's auto-filled - sounds good to me, as I would think they've been careful to make sure they don't have a typo or obsolete info in the auto-fill. Odd, I don't use auto-fill or allow sites to save my card information - I guess I'm a Luddite when it comes to privacy lol.

[Dirty Butter]

On 9/11/2016 at 6:01 PM, bsmither said:

Of a slightly lower priority is the Checkout Confirm page where a "ghost" customer can make a purchase. I will have to double-check if a "ghost" customer causes CubeCart to use the User->registerUser() function, but I think no. I think a "ghost" will use the User->createUser() function.

Thanks!! All appears to be working correctly. 

But we get a lot of one time customers. They probably don't register and then add to basket, so I would need the confirmation email for checkout-confirm as well. I added the code from content.register.php to content.checkout.confirm.php , but it doesn't verify.

content.register.php has a value of {$DATA.email}

content.checkout.confirm has a value of {$USER.email}

I finally figured out how to get Checkout and Register to confirm email addresses, so you might want to skip the next parts of the thread as I tried to figure this all out and goto the solution:

 

[Dirty Butter]

So I found the     $("#checkout_form").validate({

section of 3.cubecart.validate.js and added the same two sections of code you have for the

$("#registration_form").validate({

section.

Checkout now notifies when the email addresses are a mismatch!

[Dirty Butter]

I tried the same process with the contact page, but it did not work. There is already a verification in place to be sure the email has the correct "form" - It will allow anything that has an @ and  dot_something_or_other

I tried commenting out the form verification and leaving the verify code that worked in register and checkout, but it did not work. There are slight differences in the code structure in that section, so I probably just added it incorrectly.

[havenswift-hosting]

On 9/12/2016 at 8:01 AM, Al Brookbanks said:

Im not sure if anyone else has noticed but confirming email address seems to be going out of fashion. Less sites seem to do this. Maybe due to auto fill becoming more common??

Maybe a cool solution would be to request confirmation if say three characters or more are typed and not if less were. This way it may detect if it's auto filled or not.

With email address being so critical in an E-Commerce system, I think it is important to ensure as far as possible that they are valid.  Many people obviously still incorrectly type email addresses (hotnail.com is a common one but there are hundreds of variations of incorrect typing that customers just dont see).  Your suggestion is a good solution 

[Dirty Butter]

GitHub request https://github.com/cubecart/v6/issues/1233

[Dirty Butter]

As far as I could tell I tested all this code and it worked correctly. BUT I just received an email from someone trying to complete an order who says she keeps getting the email mismatch error message.

So I have temporarily commented out all this code.

[bsmither]

Your customer may have a stale copy of 3.cubecart.validate.js in their browser's cache.

Depends where the error message is coming from: a javascript warning right next to the email confirm text entry field, or a standard CubeCart red banner across the top of the main part of the page that comes from the controller (class) code.

[Dirty Butter]

5 minutes ago, bsmither said:

Your customer may have a stale copy of 3.cubecart.validate.js in their browser's cache.

Depends where the error message is coming from: a javascript warning right next to the email confirm text entry field, or a standard CubeCart red banner across the top of the main part of the page that comes from the controller (class) code.

I'll ask if she remembers where the error message was.

[Dirty Butter]

I commented out the pair of codes I added to the checkout section of 3.cubecart.validate.php, as well as the code sections in content.checkout.confirm.php and now the REGISTER page correctly handles email address validation.

I wonder if I would need to use something like checkout_emailconfig naming?

[Dirty Butter]

I cannot replicate the Checkout Page email confirmation working. I tried taking off the registration page confirmation, since most of our customers probably do NOT register first. I've tried it WITH and WITHOUT the user.class.php code change.

I think I found the problem with Checkout email confirmation.

/* BSMITHER CHECKOUT Validate Confirm Email Match */
            emailconf: {
                equalTo: "#user_email"
            },
/* END BSMITHER CHECKOUT Validate Confirm Email Match */

Note user_email. Whereas Registration is just #email

/* BSMITHER REGISTRATION Validate Confirm Email Match */
            emailconf: {
                equalTo: "#email"
            },
/*  END */

 

[Dirty Butter]

This is STILL a work in progress - getting closer but not right yet

[Dirty Butter]

I have now worked out all the code it takes to get Email Mismatch warning if the two email entries do not match - regardless if the customer Registers first and then adds to the basket and goes through the Checkout process OR adds an item to their basket and then goes through the Checkout process.

user.class.php

	/**
	 * Register a new user
	 *
	 * @return bool
	 */
	public function registerUser() {
		// Validation
		$error = false;
		foreach ($GLOBALS['hooks']->load('class.user.register_user') as $hook) include $hook;

		//Validate email
		if (!filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL)) {
			$GLOBALS['gui']->setError($GLOBALS['language']->common['error_email_invalid']);
			$error['email'] = true;
/* BSMITHER REGISTRATION Validate Email */
		} elseif ($_POST['email'] !== $_POST['emailconf']) {
			$GLOBALS['gui']->setError("Registration Email and Confirm Email do not match!");
			$error['email'] = true;
 /* END New */
/* BSMITHER CHECKOUT Validate Email */
		} elseif ($_POST['user_email'] !== $_POST['user_emailconf']) {
			$GLOBALS['gui']->setError("Checkout Email and Confirm Email do not match!");
			$error['user_email'] = true;
 /* END New */

		} else {

content.checkout.confirm.php

   <div class="row">
      <div class="small-12 large-8 columns"><label for="user_email" class="show-for-medium-up">{$LANG.common.email}</label><input type="text" name="user[email]" id="user_email" required value="{$USER.email}" placeholder="{$LANG.common.email}  {$LANG.form.required}" autocomplete="email"></div>
   </div>
{* BSMITHER NEW Confirm Email *}
   <div class="row">
      <div class="small-12 large-8 columns"><label for="user_emailconf" class="show-for-medium-up">Confirm Email</label><input type="text" name="user_emailconf" id="user_emailconf" value="" placeholder="Confirm Email  {$LANG.form.required}" required ></div>
   </div>
{* END NEW *}

and at the bottom of content.checkout.confirm.php

<div class="hide" id="validate_terms_agree">{$LANG.account.error_terms_agree}</div>
{* BSMITHER Validate Confirm Email Message *}
<div class="hide" id="validate_user_email_mismatch">"Email Mismatch"</div>
{* END NEW *}

content.register.php

   <div class="row">
      <div class="small-12 large-8 columns"><label for="email" class="show-for-medium-up">{$LANG.common.email}</label><input type="text" name="email" id="email" value="{$DATA.email}" placeholder="{$LANG.common.email}  {$LANG.form.required}" required ></div>
   </div>
{* BSMITHER REGISTER Confirm Email *}
   <div class="row">
      <div class="small-12 large-8 columns"><label for="emailconf" class="show-for-medium-up">Confirm Email</label><input type="text" name="emailconf" id="emailconf" value="" placeholder="Confirm Email  {$LANG.form.required}" required ></div>
   </div>
{* END REGISTER CONFIRM EMAIL *}

and at the bottom of content.register.php

<div class="hide" id="validate_required">{$LANG.form.required}</div>
{* BSMITHER REGISTER Validate Confirm Email Message *}
<div class="hide" id="validate_email_mismatch">"Email Mismatch"</div>
 {* END REGISTER EMAIL VALIDATE *}

Now the javascript that makes this work: in the skins js folder - 3.cubecart.validate.js. There are two different sections that have to be modified, one for the checkout and one for the register scenarios.

FIND     $("#checkout_form").validate({
 SO YOU KNOW YOU ARE IN THE CORRECT SECTION:
-----ADD THIS CODE JUST ABOVE THE PHONE CODE-----

/* BSMITHER CHECKOUT Validate Confirm Email Match */
            user_emailconf: {
                equalTo: "#user_email"
            },
/* END BSMITHER CHECKOUT Validate Confirm Email Match */


AND FURTHER DOWN IN THAT SAME CHECKOUT SECTION:

/* BSMITHER CHECKOUT Validate Confirm Email Match */
            user_emailconf: {
                required: $('#validate_user_email_mismatch').text(),
                equalTo: $('#validate_user_email_mismatch').text()
            },
/* END BSMITHER CHECKOUT Validate Confirm Email Match */

------ADDED JUST ABOVE THE PHONE CODE------

in that same 3.cubecart.validate.js file

FIND     $("#registration_form").validate({
SO YOU KNOW YOU ARE IN THE REGISTRATION SECTION

-----ADD ABOVE THE PHONE CODE ---
/* BSMITHER REGISTRATION Validate Confirm Email Match */
            emailconf: {
                equalTo: "#email"
            },
 /* END */



-----AND FURTHER DOWN, AGAIN ABOVE THE PHONE CODE-----

/* BSMITHER REGISTRATION Validate Confirm Email Match */
            emailconf: {
                required: $('#validate_email_mismatch').text(),
                equalTo: $('#validate_email_mismatch').text()
            },
 /* BSMITHER END */

Hopefully my directions make sense - I'm used to following directions - not giving them, and usually have trouble following them, too!!

[Dirty Butter]

@bsmither I tried today to add the confirm code for contact_email and contact_emailconf, but was not able to figure out how to add it to 3.cubecart.validate.js

[Dirty Butter]

I need some help getting these validations to work with 6.1.6. Commenting out this section in user.class.php makes Checkout work. With all this live, I get a phantom blurb in a bubble saying something needs to be validated.

/* BSMITHER REGISTRATION Validate Email 
		} elseif ($_POST['email'] !== $_POST['emailconf']) {
			$GLOBALS['gui']->setError("Registration Email and Confirm Email do not match!");
			$error['email'] = true;
  END New
 BSMITHER CHECKOUT Validate Email 
		} elseif ($_POST['user_email'] !== $_POST['user_emailconf']) {
			$GLOBALS['gui']->setError("Checkout Email and Confirm Email do not match!");
			$error['user_email'] = true;
  END New 
BSMITHER CONTACT Validate Email 
		} elseif ($_POST['contact_email'] !== $_POST['contact_emailconf']) {
			$GLOBALS['gui']->setError("Your Email and Confirm Email do not match!");
			$error['contact_email'] = true;
  END New */