Solved

Colfusion form needs validation of email and matching email

Posted on 2011-09-22
2
218 Views
Last Modified: 2012-05-12
We need help with the following form:
http://www.abbe-lib.org/feedbackDigitalBranch

.cfm

Currently, if a user submits the form without

entering an email address, they receive an error

message window ("Attribute validation error for

tag CFMAIL") that is intended for debugging.

Instead, we want the user to receive a message

"Please enter a valid e-mail address" and "E-mail

addresses must match."

The form should be submitted only if a valid

email address and a matching email address are

supplied. Messages should be displayed if the

addresses are missing, not in the correct

format, or fail to match one another.

Here is the current code:


<html>
<head>
<style type="text/css">
body{font-size: 14pt}
TD{font-size: small;font-weight:normal;}
h1{text-align:center;}
.style1 {
      font-family: Arial, Helvetica,

sans-serif;
      font-size: x-large;
      font-weight: bold;
}
.style2 {font-family: Arial, Helvetica, sans-serif;
                        font-size:

large;
                        color:

#FFFFFF;
}
.Text {
      font-family: Arial, Helvetica,

sans-serif;
      font-weight: normal;
      font-size: small;
}
.style6 {font-family: Arial, Helvetica, sans-serif;

font-size: small; }
.style7 {font-family: Arial, Helvetica, sans-serif;

font-weight: bold; font-size: small; }
</style>
<title>ABBE Digital Branch Library Download Help

Form</title>

</head>

<body>
<p>&nbsp;</p>

<cfform method="Post"

onsubmit="if(email.value!=email2.value){alert('P

lease make sure email addresses match!');return

false}" action="formmailDigitalBranch.cfm">

<table width="76%" border="0" align="center"

cellpadding="0" cellspacing="0">
<tr>
<td width="43%"></td>
<td width="57%"></td>
</tr>

<tr>
  <td colspan="2">
    <div align="center">
      <p align="center"

class="style1"><strong><span

class="style2"><img

src="Digital/images/ABBEDigitalLibraryBanner.p

ng" width="668" height="75" alt="ABBE Digital

Library" /></span></strong></p>
      <p class="style1">        DOWNLOAD
        HELP FORM</p>
    </div>
  </td>
<tr>
<td colspan="2">
  <div align="center">
    <p class="style7">In order to facilitate

troubleshooting please provide the following

information:</p>
    </div>
</td>
<tr>
  <td class="Text">
    <p class="Text"><strong>Describe the

Problem</strong><br>
      Use as much detail as possible, including

steps taken just before the problem

happened.</p>
    </td>
  <td>
    <p>&nbsp;      </p>
    <p>
      <textarea rows="2" name="Comments"

cols="60"></textarea>
    </p>
    <p>&nbsp;      </p>
  </td>
</tr>
<tr>
  <td class="style7">Exact text of any error

message </td>
  <td>
    <textarea rows="2" name="ErrorMessage"

cols="60"></textarea>
  </td>
</tr>
<tr>
  <td class="style6"><strong>URL(s) of Error

Page<br />
  </strong>Web address as it appears on an

error message page. (Screenshots may be

emailed to:<br>
  ABBEinfo@abbe-lib.org) </td>
  <td>
    <textarea rows="2" name="ErrorURLs"

cols="60"></textarea>
  </td>
</tr>
<tr>
<td width="43%" class="Text"><span

class="style7">Title(s) of Problem

Download(s)</span></td>
<td width="57%"><textarea rows="2"

name="ProblemDownloadTitle"

cols="60"></textarea></td>
</tr>
<tr>
  <td class="Text"><span

class="style6"><strong>Applicable Software and

Version</strong><br>
OverDrive Media Console 3.2 for Windows,

Adobe Digital Editions 1.7.2.1131, etcetera<br>
(can usually be found under

Help&gt;About)</span></td>
  <td>
    <textarea rows="2" name="Software"

cols="60"></textarea>
  </td>
</tr>
<tr>
  <td class="Text">
    <p><strong>Operating System<br>
    </strong>Mac<span

class="style6">&reg;</span> OS 10.6.2,

Windows<span class="style6">&reg;</span> 7,

Windows<span class="style6">&reg;</span>

Vista, WIndows<span

class="style6">&reg;</span> XP, etcetera </p>
    </td>
  <td>
    <textarea rows="2" name="OS"

cols="60"></textarea>
  </td>
</tr>
<tr>
<td width="43%" class="Text">
  <p class="style6"><strong>Internet Browser and

Version<br>
  </strong>Internet Explorer&reg; 8.0,

Firefox&reg; 3.0, etcetera</td>
<td width="57%"><textarea rows="2"

name="Browser" cols="60"></textarea></td>
</tr>
<tr>
<td width="43%" class="Text">
  <p class="Text"><strong>Device Type, if

applicable </strong><br>
    Android&trade;, BlackBerry
   
    , NookColor, etcetera</td>
<td width="57%"><textarea rows="2"

name="DeviceType" cols="60"></textarea></td>
</tr>
<tr>
<td width="43%" class="Text">&nbsp;</td>
<td width="57%">&nbsp;</td>
</tr>
<tr>
<td width="43%" class="Text"><span

class="style6"><b>Cardholder

Name</b></span></td>
<td width="57%"><cfinput type=text

name=Person size=50></td>
</tr>
<tr>
  <td class="Text"><span class="style7">Library

Card Number</span></td>
  <td>
    <cfinput type=text name=LibraryCardNumber

size=50>
  </td>
</tr>
<tr>
<td width="43%" class="Text"><span

class="style6"><b>Email address

</b></span></td>
<td width="57%"><cfinput type=text name=Email

size=50 ></td>
</tr>
<tr>
  <td class="Text"><strong>Re-enter Email

</strong></td>
  <td>
    <cfinput type=text name=EmailMatch

size=50>
  </td>
</tr>
<tr>
<td width="43%" class="Text"><span

class="style6"><strong>Telephone</strong></sp

an></td>
<td width="57%"> <cfinput type=text

name=Telephone size=50></td></tr>
<tr>
  <td class="Text"><span class="style7">Would

you like a response from us? </span></td>
  <td>
    <cfinput type="radio" name="Response"

value="Yes">
    Yes
    <cfinput type="radio" name="Response"

value="No" checked="yes">
    No</td>
</tr>
</table>

<br>
<input type="submit" value="Submit"><input

type="reset" value="Reset"></p>
</cfform>

<script type="text/javascript">
try {
var pageTracker =

_gat._getTracker("UA-9277239-1");
pageTracker._trackPageview();
} catch(err) {}</script>

</body>
</html>
0
Comment
Question by:abbetech
2 Comments
 
LVL 63

Accepted Solution

by:
Zvonko earned 500 total points
Comment Utility
How about this:
<html> 
<head> 
<style type="text/css"> 
body{font-size: 14pt} 
TD{font-size: small;font-weight:normal;} 
h1{text-align:center;} 
.style1 {
      font-family: Arial, Helvetica, sans-serif;
      font-size: x-large;
      font-weight: bold;
}
.style2 {
      font-family: Arial, Helvetica, sans-serif;
      font-size: large;
      color: #FFFFFF;
}
.Text {
      font-family: Arial, Helvetica, sans-serif;
      font-weight: normal;
      font-size: small;
}
.style6 {
      font-family: Arial, Helvetica, sans-serif; 
      font-size: small; 
}
.style7 {
      font-family: Arial, Helvetica, sans-serif; 
      font-weight: bold; 
	  font-size: small; 
}
</style> 
<title>ABBE Digital Branch Library Download Help Form</title> 
<script>
function checkEmail(theForm){
  if(!theForm.Email.value.match(/^\w+([\.\-]\w+)*@\w+([\.\-]\w+)*\.[a-z]{2,4}$/i)){
    alert('Please enter a valid e-mail address');
	theForm.Email.select();
	theForm.Email.focus();
    return false;
  }
  if(theForm.Email.value!=theForm.EmailMatch.value){
    alert( "E-mail addresses must match.");
	theForm.EmailMatch.select();
	theForm.EmailMatch.focus();
    return false;
  }
  return true;
}
</script>
</head> 
<body>
<p>&nbsp;</p>
<cfform method="Post" onsubmit="return checkEmail(_CF_this)" action="formmailDigitalBranch.cfm" preservedata="true"> 
<table width="76%" border="0" align="center" cellpadding="0" cellspacing="0"> 
<tr> 
<td width="43%"></td> 
<td width="57%"></td> 
</tr> 
<tr>
  <td colspan="2">
    <div align="center">
      <p align="center" class="style1">
	    <strong>
		  <span class="style2">
		    <img src="Digital/images/ABBEDigitalLibraryBanner.png" width="668" height="75" alt="ABBE Digital Library" />
		  </span></strong>
	  </p>
      <p class="style1">        DOWNLOAD        HELP FORM</p>
    </div>
  </td>
<tr>
<td colspan="2">
  <div align="center">
    <p class="style7">In order to facilitate troubleshooting please provide the following information:</p>
    </div>
</td>
<tr>
  <td class="Text">
    <p class="Text"><strong>Describe the Problem</strong><br>
      Use as much detail as possible, including steps taken just before the problem happened.</p>
    </td>
  <td>
    <p>&nbsp;      </p>
    <p>
      <textarea rows="2" name="Comments" cols="60"></textarea>
    </p>
    <p>&nbsp;      </p>
  </td>
</tr>
<tr>
  <td class="style7">Exact text of any error message </td>
  <td>
    <textarea rows="2" name="ErrorMessage" cols="60"></textarea>
  </td>
</tr>
<tr>
  <td class="style6"><strong>URL(s) of Error Page<br />
  </strong>Web address as it appears on an error message page. (Screenshots may be emailed to:<br> 
  ABBEinfo@abbe-lib.org) </td>
  <td>
    <textarea rows="2" name="ErrorURLs" cols="60"></textarea>
  </td>
</tr>
<tr> 
<td width="43%" class="Text"><span class="style7">Title(s) of Problem Download(s)</span></td> 
<td width="57%"><textarea rows="2" name="ProblemDownloadTitle" cols="60"></textarea></td> 
</tr> 
<tr>
  <td class="Text"><span class="style6"><strong>Applicable Software and Version</strong><br>
OverDrive Media Console 3.2 for Windows, Adobe Digital Editions 1.7.2.1131, etcetera<br>
(can usually be found under Help&gt;About)</span></td>
  <td>
    <textarea rows="2" name="Software" cols="60"></textarea>
  </td>
</tr>
<tr>
  <td class="Text">
    <p><strong>Operating System<br>
    </strong>Mac<span class="style6">&reg;</span> OS 10.6.2, Windows<span class="style6">&reg;</span>
	7, Windows<span class="style6">&reg;</span> Vista, WIndows<span class="style6">&reg;</span> XP, etcetera </p>
    </td>
  <td>
    <textarea rows="2" name="OS" cols="60"></textarea>
  </td>
</tr> 
<tr> 
<td width="43%" class="Text">
  <p class="style6"><strong>Internet Browser and Version<br>
  </strong>Internet Explorer&reg; 8.0, Firefox&reg; 3.0, etcetera</td> 
<td width="57%"><textarea rows="2" name="Browser" cols="60"></textarea></td> 
</tr> 
<tr> 
<td width="43%" class="Text">
  <p class="Text"><strong>Device Type, if applicable </strong><br>
    Android&trade;, BlackBerry, NookColor, etcetera</td> 
<td width="57%"><textarea rows="2" name="DeviceType" cols="60"></textarea></td> 
</tr> 
<tr> 
<td width="43%" class="Text">&nbsp;</td> 
<td width="57%">&nbsp;</td> 
</tr> 
<tr> 
<td width="43%" class="Text"><span class="style6"><b>Cardholder Name</b></span></td> 
<td width="57%"><cfinput type=text name=Person size=50></td> 
</tr>
<tr>
  <td class="Text"><span class="style7">Library Card Number</span></td>
  <td>
    <cfinput type=text name=LibraryCardNumber size=50>
  </td>
</tr> 
<tr> 
<td width="43%" class="Text"><span class="style6"><b>Email address </b></span></td> 
<td width="57%"><cfinput type=text name=Email size=50 ></td> 
</tr>
<tr>
  <td class="Text"><strong>Re-enter Email </strong></td>
  <td>
    <cfinput type=text name=EmailMatch size=50>
  </td>
</tr> 
<tr> 
<td width="43%" class="Text"><span class="style6"><strong>Telephone</strong></span></td> 
<td width="57%"> <cfinput type=text name=Telephone size=50></td></tr>
<tr>
  <td class="Text"><span class="style7">Would you like a response from us? </span></td>
  <td>
    <cfinput type="radio" name="Response" value="Yes"> Yes
    <cfinput type="radio" name="Response" value="No" checked="yes"> No</td>
</tr>
</table> 
<br> 
<input type="submit" value="Submit"><input type="reset" value="Reset"></p> 
</cfform> 
</body> 
</html>

Open in new window

0
 
LVL 1

Author Closing Comment

by:abbetech
Comment Utility
TO be honest, I haven't had time to really test this. I'll comment once I test it out. Thanks!
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Problem in SELECT Statement 5 74
Why am I getting a binary result from my query? 5 70
cfchart display 12 91
paging 3 27
PROBLEM: How to add your own buttons to the bottom toolbar with paging info ( result count ). While creating a cfgrid, I ran into an issue where I wanted to embed my own custom buttons where the default ones ( insert / delete / etc… ) are for aes…
This is an updated version of a post made on my blog over 3 years ago. It is unfortunately, still very relevant as we continue to see both SQLi (SQL injection) and XSS (cross site scripting) attacks hitting some of the most recognizable website and …
This video shows how to remove a single email address from the Outlook 2010 Auto Suggestion memory. NOTE: For Outlook 2016 and 2013 perform the exact same steps. Open a new email: Click the New email button in Outlook. Start typing the address: …
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now