Programming instructions

114 Lesson 4 Validating Data to Enforce Business Rules
The important point about the preceding JavaScript is that you can use two functions,
isitFutureDate and validateTripDateRange, to verify whether a date is in the future
and the trip date range is valid, respectively.
Exercise: add JavaScript-based validation code
In this exercise you will modify the Trip Insert page to validate the departure and return
dates using the JavaScript functions provided.
To validate the departure and return dates using JavaScript functions:
1 Open tripedit.cfm in your editor and do one of the following:
Copy example code provided Copy the tripsedit3.cfm file from the solutions
directory and rename it to tripedit.cfm in the my_app subdirectory
or
Add JavaScript-based validation code to tripedit.cfm Follow these steps to
modify the tripedit.cfm page:
a Copy and insert the text from the scriptvalidation.txt in the solutions directory
right before the HTML
body tag in tripedit.cfm.
bModify the
departureDate and returnDate input tags to include the
onValidate attributes as follows:
<cfinput name="departureDate" size="10" validate="date"
onvalidate="isitFutureDate" message="Departure date must be a valid
future date (mm/dd/yyyy).">
<cfinput size="10" name="returnDate" validate="date"
onvalidate="validateTripDateRange" message="Return date must be a valid
date greater than departure date (mm/dd/yyyy).">
c Save the tripedit.cfm in the my_app directory.
2 Test this page by opening the tripedit.cfm page in your browser.
3 Test the date validation by checking that each of the following tasks fail:
a Enter a date in the past for the departure date field; for example, 01/01/2000.
b Enter a departure date greater than the return date; for example, enter
02/01/2004 for the departure date, and 01/01/2004 for the return date.
4 Test the date validation and ensure that the proper data succeeds; for example, enter
01/01/2004 for the departure date, and 01/14/2004 for the return date.
5 Test for an invalid date by entering 12/32/2002 for the return date.
You would expect the application to reject this date. It does not. This is because the
validate attribute of a cfinput tag (returnDate in this example) is ignored when
there is a JavaScript routine specified in the
onValidate attribute. To correct this,
you must write a test to validate the date using JavaScript (not addressed in this
tutorial).