SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2007
    Location
    Ohio
    Posts
    54
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to require email confirmation (re-typing)

    Hello everyone,

    I've been searching all over the place and all through these forums and I'm just not coming up with a solution. I am sure it's because I don't know HOW to search for this. Anyway...

    I am creating a contact form and in it, I need to include the feature that requires users to re-type their email address to confirm there are no errors in it. Do you know what I mean? Is this done with JavaScript? And can anyone point me to a place where I can use some pre-existing code since I don't know how to write it?

    TIA!
    Susan
    Auxano Creative (formerly The WebDesign Loft)

  2. #2
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <title>Untitled Document</title>
            <link rel="stylesheet" type="text/css" media="screen" />
            <style type="text/css"></style>
            <script type="text/javascript">
                function validateEmail() {
                    var txtEmail = document.getElementById('txtEmail');
                    var txtConfirmEmail = document.getElementById('txtConfirmEmail');
                    var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
                    if (!filter.test(txtEmail.value)) { 
                        alert('Invalid E-Mail Address'); 
                        txtEmail.focus(); 
                        return false; 
                    }
                    if (txtConfirmEmail.value == '') {
                        alert('Please confirm your E-Mail Address');
                        txtConfirmEmail.focus();
                        return false;
                    }
                    if (txtEmail.value.toLowerCase() != txtConfirmEmail.value.toLowerCase()) {
                        alert('E-Mail Addresses do not match');
                        txtConfirmEmail.focus();
                        return false;
                    }
                    return true;
                }
            </script>
        </head>
        <body>
    
            <form onsubmit="return validateEmail()">
            
            <label for="txtEmail">E-Mail Address:</label><input type="text" id="txtEmail" /><br />
            <label for="txtEmail">Confirm E-Mail Address:</label><input type="text" id="txtConfirmEmail" /><br />
    
            <input type="submit" value="go" />
    
            </form>
    
        </body>
    </html>


  3. #3
    SitePoint Enthusiast
    Join Date
    Jun 2007
    Location
    Ohio
    Posts
    54
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks so much for your reply.

    I'm curious...what does this script do if the emails typed are different?

    I don't have it working yet for some reason.
    Susan
    Auxano Creative (formerly The WebDesign Loft)

  4. #4
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Click go to get a response.

    way to test is:

    1: type in test@test in E-Mail Address field and click go. This will result in an invalid e-mail address error.
    2: type in test@test.com in E-Mail Address field and click go. This will result in an error stating you must confirm the email address.
    3: type in test@test in the Confirm E-Mail Address field and click go. This will result in an e-mail addresses do not match error.
    4: type in test@test.com in the Confirm E-Mail Address field and click go. this will refresh the page.



Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •