Okay first off we need an
Application.cfm file in the directory that will hold the form.cfm and the
action_form.cfm files. This application file is important as we are going to
create a session to hold our form values while we do our validation. We need to
hold these values in the event that our validation fails and we have to show
the user the form again to correct their errors. We don't want our user to have
to re-fill in values they have already filled in so hence the use of the
session.
Note page division are separated by the ====== line!
<!-- Our Application.cfm
file can be as simple as this -->
<cfapplication
name="myForms"
sessionmanagement="Yes"
setclientcookies="No"
sessiontimeout="#CreateTimeSpan(0,20,0,0)#">
===========================================================
<!-- This is our form
code that goes in form.cfm page -->
<!-- Note the action in
our form tag is passing the form values to our action_form.cfm page -->
<form
name="info" method="post"
action="action_form.cfm">
<table width="100%"
border="0" align="center"
cellpadding="0">
<tr
valign="middle">
<td
colspan="2"><center><h3>We
would like to hear from you.</h3></center></td>
</tr>
<tr>
<!-- Note I have
deliberately placed a checkbox in here as validating checkboxes can be a pain
-->
<td
align="right" valign="center">Sign me up to Your Mailing
List: </td>
<td
align="left" valign="center"><input
type="checkbox" name="signup" value="yes"></td>
</tr>
<tr>
<td
align="right" valign="center"> Name :
</td>
<td
align="left" valign="center"><input
name="name" type="text"></td>
</tr>
<tr>
<td
align="right" valign="center"> E-mail :
</td>
<td
align="left" valign="center"><input
name="email" type="text"></td>
</tr>
<tr>
<td
align="right" valign="top"> Comments :
</td>
<td
align="left" valign="center"><textarea
cols="40" rows="2"
name="comments"></textarea></td>
</tr>
<tr
valign="middle">
<td colspan="2"
align="center"><br><input
name="Submit" type="submit" value="Submit"></td>
</tr>
</table>
</form>
<!-- ===========================================================
-->
<!-- This is our
action_form.cfm Page -->
<!--- Must create this
default structure or we pull an error --->
<cfparam
name="session.contact_nfo" default="">
<cfif NOT IsStruct(session.contact_nfo)>
<cfset session.contact_nfo = StructNew()>
</cfif>
<!-- Now we create
default variable using cfparam -->
<cfparam
name="Form.terms" default="NO">
<cfparam
name="session.contact_nfo.Name" default="">
<cfparam
name="session.contact_nfo.email" default="">
<cfparam
name="session.contact_nfo.comments" default="">
<!-- Now we clear the
Session of any Values to allow us to place our new form Values passed
from our form page -->
<cfset StructClear(session.contact_nfo)>
<!-- Now we are placing
our Form Values into the Session -->
<cfset session.contact_nfo.terms=
form.terms>
<cfset session.contact_nfo.Name=
form.Name>
<cfset session.contact_nfo.email=
form.email>
<cfset session.contact_nfo.comments=
form.comments>
<!-- Now we are going to
do our Error Checking first off by creating a
value of nothing for the variable we are calling
Errors -->
<cfparam
name="errors" type="string" default="">
<!-- As we check for
Errors if we find one we place it in our List to display to our user making it easy
for the end-user to correct as they can see the error -->
<!-- Notice we are not
validating the checkbox as it is not a required form field -->
<cfif form.Name EQ
"">
<cfset errors = errors & "<li>You
Forgot to enter your name!</li>">
</cfif>
<!-- Checking the email is
a little more complicated so we use a regular expression to check and see if there is
a email address and also is it formed properly -->
<cfif NOT REFindnocase("^[-_!a-z0-9\.]+@([-_a-z0-9]+\.)+[a-z]{2,6}$",
email)>
<cfset errors = errors & "<li class=""errors"">Your
Email Address seems incorrect?</li>">
</cfif>
<cfif form.comments EQ
"">
<cfset errors = errors & "<li
class=""errors"">You Forgot to enter a
comment!</li>">
</cfif>
<!-- If any errors were detected in the previous
section we now show the form again placing our error
messages in a list to show the users the errors they need to correct Now this is
where we use the session we created, we don't want our user to have to re-enter
good data again so we show him the form with the original data he entered in
it saving him typing time. This will make perfect sense on a long form where
quite possibly you could lose a potential customer if they get annoyed at
having to re-fill in information again -->
<cfif errors NEQ
"">
<!-- Here we are
collecting the Error Message generated by our code and placing them into a list for the
user to see -->
<table
width="100%" border="0"
align="center"
cellpadding="0">
<tr>
<td>You have some errors in your
form submission! Please try again!<br>
<ol>
<cfoutput>#errors#</cfoutput>
</ol></td>
</tr>
</table>
<!-- Notice that this is
basically the same form we used in form.cfm we some very important changes one of
which is the whole form is wrapped in a cfoutput tag which is needed as we are going to
be outputting our session values into the form, showing the user what he originally
placed in the original form.cfm template. Also take note that the form action is now
different in that it is carrying the applications session with it which we need to
make our Application.cfm file work with the action. -->
<cfoutput>
<form
method="post"
action="action_form.cfm?#session.UrlToken#">
<table
width="100%" border="0"
align="center"
cellpadding="0">
<tr
valign="middle">
<td
colspan="2"><center><h3>We
would like to hear from you.</h3></center></td>
</tr>
<tr>
<td
align="right" valign="center">Sign me up to Your Mailing
List: </td>
<td
align="left" valign="center">
<!-- Because we didn't
need to do error checking for our checkbox we have to approach it a little different than the
other fields in our form in order to reflect any previous values -->
<cfif session.trip_nfo.signup eq "yes"><input name="signup" type="checkbox"
value="yes" checked="checked">
<cfelse><input name="signup"
type="checkbox"
value="yes">
</cfif></td>
</tr>
<tr>
<td
align="right" valign="center"> Name :
</td>
<td
align="left" valign="center">
<!-- This is how we place
our session values into the form field also important to note the because we used cfparam in
the start of this page to assign a default value of "" if there was no value
originally entered
in the form than it will show no value here. If we did not use the cfparam tag we would now
show an error as the session would go looking for a non-existant value -->
<input
type="text" name="Name"
value="#session.contact_nfo.Name#"></td>
</tr>
<tr>
<td
align="right" valign="center"> E-mail :
</td>
<td
align="left" valign="center"><input
type="text" name="email"
value="#session.contact_nfo.email#"></td>
</tr>
<tr>
<td
align="right" valign="top"> Comments :
</td>
<td
align="left" valign="center"><textarea
cols="40" rows="2"
name="comments">#session.contact_nfo.comments#</textarea></td>
</tr>
<tr
valign="middle">
<td colspan="2"
align="center"><br><input
name="Submit" type="submit" value="Submit"></td>
</tr>
</table>
</form>
</cfoutput>
<!-- If no errors were
detected we abort the previous code and show the next code section -->
<cfabort>
</cfif>
<!-- In this next section
we can now take our form values and do what ever we decide to do with them i.e. mailing them to
ourselves, placing them into a database, or a combination of both. In this section it is wise to
let the user know that his information has been received as coldfusion has no way of letting them
know -->