FormValidation/lesson7AppProject2.html at master · SirPranceAlot/FormValidation · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lesson 7 Application Project</title>

<script language="javascript">
<!--


    function validate(form) {
	var clock = new Date();
	var expMoLen = form.expMo.length;
	var month = clock.getMonth();
	var year = clock.getFullYear();
	var expYrLen = form.expYr.length;
	var ccardLen = form.ccard.length;
	// Check if credit card year has expired.
	for (var i = 0; i < expYrLen;i++) {
	if (form.expYr[i].selected) {
	var expYr = form.expYr[i].value
	if (expYr < year) {
	alert("Your card has expired.")
	break
	}
	}
	}
	// Check month if expiration year match current year.
	if (expYr == year) {
	for (var i = 0; i < expMoLen;i++) {
	if (form.expMo[i].selected) {
	var expMo = form.expMo[i].value
	if (expMo < month) {
	alert("Your card has expired.")
	break
	}
	}
	}
	}
	// Check if selected card issuer is the correct issuer according to credit card number.
	for (var i = 0; i < ccardLen;i++) {
	if (form.ccard[i].checked) {
	var ccard = form.ccard[i].value;
	switch (ccard) {
	case "visa":
	if (form.number.value.charAt(0) != 4 || form.number.value.length != 16)
	alert("This is not a valid visa card number.")
	break
	case "mc":
	if (form.number.value.charAt(0) != 5 || form.number.value.length != 16)
	alert("This is not a valid mastercard number.")
	break
	case "amex":
	if (form.number.value.charAt(0) != 3 || form.number.value.length != 15)
	alert("This is not a valid American Express number.")
	break
	default:
	}
	}
	}
	}

//-->
</script>

</head>

<body>

<h3>CIW JavaScript Specialist</h3>
<hr />
<form name="ccForm">
<p>
<input type="radio" name="ccard" value="visa" />
Visa
</p>
<p>
<input type="radio" name="ccard" value="mc" />
MasterCard
</p>
<p>
<input type="radio" name="ccard" value="amex" />
American Express
</p>
<p>
Card #
<input type="text" name="number" />
</p>
<p>
Exp Date:
<select name="expMo">
<option value=0>Jan </option>
<option value=1>Feb </option>
<option value=2>Mar </option>
<option value=3>Apr </option>
<option value=4>May </option>
<option value=5>Jun </option>
<option value=6>Jul </option>
<option value=7>Aug </option>
<option value=8>Sep </option>
<option value=9>Oct </option>
<option value=10>Nov </option>
<option value=11>Dec </option>
</select>
<select name="expYr">
<option value=2011>2011 </option>
<option value=2012>2012 </option>
<option value=2013>2013 </option>
<option value=2014>2014 </option>
<option value=2015>2015 </option>
<option value=2016>2016 </option>
<option value=2017>2017 </option>
<option value=2018>2018 </option>
</select>
</p>

<input type="button" value="Check Form" onClick="validate(this.form);" />
<input type="reset" value="Reset Form" />
</form>

</body>
</html>