HTML and CSS Reference
In-Depth Information
EXAMPLE
17.46 (
CONTINUED
)
<body>
8
<form name="myForm"
action="http://127.0.0.1/cgi-bin/env.cgi"
9
onSubmit="return validExpire(this)">
<p>
Enter the month (02 or 2):
<input name="expireMonth" type="text" size=5 />
</p><p>
Enter the year (2003 or 03):
<input name="expireYear" type="text" size=5 />
<input type="submit" value="submit" />
<input type="reset" value="clear" />
</p>
</form>
</body>
</html>
EXPLANATION
1
A function called
validExpire()
is defined. It takes one parameter, a reference to a
form. Its purpose is to validate the expiration date of a credit card.
2
A new
Date
object is created and assigned to the variable called
now
.
3
Using the
getMonth()
method, we get this month (months start at zero) and add 1.
4
Using the
getFullYear()
method, we get the current year, as
2003
.
5
The
parseInt()
function converts the expiration year, as typed in by the user, to an
integer. Then we get the length of the year, and convert the month into an integer.
If the number of characters in the year,
yearLength
, is 2, then 2000 is added to the
expireYear
value. If the user typed 02, then the new value is 2002.
6
If the value of
expireMonth
is less than the value of
thisMonth
and the value of
ex-
pireYear
is equal to the value of
thisyear,
or the value of
expireMonth
is greater than
12, the number entered is invalid. So a card is invalid if it has a month prior to
this month and the card expires this year, or the month is over 12, because there
are only 12 months in a year.
7
If the expiration year is prior to this year, it is also invalid.
8
The form starts here.
9
The
onSubmit
event handler is triggered after the user fills out the form and clicks
the submit button. When he or she does, the function called
validExpire()
is
called. It will return
true
if the expiration date is valid, and the form will be sent
to the URL assigned to the
action
attribute of the form. See Figure 17.50.
