Skip to content

Commit 680e2df

Browse files
committed
Finished Chapter 17 Exercise 1
1 parent 2f96704 commit 680e2df

File tree

1 file changed

+128
-0
lines changed

1 file changed

+128
-0
lines changed

ch17exercise1.html

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
<!DOCTYPE html>
2+
3+
<html lang="en">
4+
<head>
5+
<title>Chapter 14: Example 1</title>
6+
<style>
7+
.fieldname {
8+
text-align: right;
9+
}
10+
11+
.submit {
12+
text-align: right;
13+
}
14+
</style>
15+
</head>
16+
<body>
17+
<form id="whole">
18+
<table>
19+
<tr>
20+
<td class="fieldname">
21+
Username:
22+
</td>
23+
<td>
24+
<input type="text" id="username" />
25+
</td>
26+
</tr>
27+
<tr>
28+
<td class="fieldname">
29+
Email:
30+
</td>
31+
<td>
32+
<input type="text" id="email" />
33+
</td>
34+
</tr>
35+
<tr>
36+
<td class="fieldname">
37+
Password:
38+
</td>
39+
<td>
40+
<input type="text" id="password" />
41+
</td>
42+
<td />
43+
</tr>
44+
<tr>
45+
<td class="fieldname">
46+
Verify Password:
47+
</td>
48+
<td>
49+
<input type="text" id="password2" />
50+
</td>
51+
<td />
52+
</tr>
53+
<tr>
54+
<td colspan="2" class="submit">
55+
<input type="submit" value="Submit" id="Sub" />
56+
</td>
57+
<td />
58+
</tr>
59+
</table>
60+
</form>
61+
<script src="prototype.1.7.2.js"></script>
62+
<script>
63+
function checkUsername(e) {
64+
e.preventDefault();
65+
66+
var userValue = $("username").value;
67+
68+
if (!userValue) {
69+
alert("Please enter a user name to check!");
70+
return;
71+
}
72+
73+
var options = {
74+
method: "get",
75+
onSuccess: checkEmail,
76+
onFailure: handleUsername,
77+
parameters: {
78+
username: userValue
79+
}
80+
};
81+
new Ajax.Request("ch14_formvalidator.php", options);
82+
}
83+
84+
function checkEmail(responseText) {
85+
var response = JSON.parse(responseText);
86+
alert(response.searchTerm + " is available!");
87+
88+
e.preventDefault();
89+
90+
var emailValue = $("email").value;
91+
92+
if (!emailValue) {
93+
alert("Please enter an email address to check!");
94+
return;
95+
}
96+
97+
var options = {
98+
method: "get",
99+
onSuccess: handleEmail,
100+
onFailure: handleUsername,
101+
parameters: {
102+
email: emailValue
103+
}
104+
};
105+
new Ajax.Request("ch14_formvalidator.php", options);
106+
}
107+
108+
function handleUsername(responseText) {
109+
var response = JSON.parse(responseText);
110+
alert("We're sorry, but " + response.searchTerm + " is not available.");
111+
}
112+
113+
function handleEmail(responseText) {
114+
var response = JSON.parse(responseText);
115+
116+
if (response.available) {
117+
alert(response.searchTerm + " is available!");
118+
$("Sub").submit();
119+
} else {
120+
alert("We're sorry, but " + response.searchTerm + " is not available.");
121+
return;
122+
}
123+
}
124+
$("Sub").observe("click", checkUsername);
125+
</script>
126+
</body>
127+
128+
</html>

0 commit comments

Comments
 (0)