-
Notifications
You must be signed in to change notification settings - Fork 0
/
msgEntryTest.html
105 lines (81 loc) · 3.35 KB
/
msgEntryTest.html
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
<!doctype html>
<html>
<head>
<title>Message Board Entry</title>
</head>
<body>
<h1>Message Board Entry Page</h1>
<h2>(under development!)</h2>
<form action="http://www.cs.kzoo.edu/cs105/labs/MessageBoard/testMsg.php" method="POST">
<!-- EXAMPLE ELEMENTS FROM MINI-LAB -->
<label for="userName">Your Name: </label>
<input type="text" name="posted_by" id="userName" size="30" />
<br />
<input type="radio" name="salutation" id='option1' value='Dr.' />Dr.<br />
<input type="radio" name="salutation" id='option2' value='Mr.' />Mr.<br />
<input type="radio" name="salutation" id='option3' value='Ms.' />Ms.<br />
<label for="topic">Topic: </label>
<input type="text" name="topic" id="topic" size="30" />
<br />
<label for="message">Message: </label>
<textarea name="message" id="message" rows="3" columns="10">
</textarea>
<br />
<label for="menuSelection">Color: </label>
<select name="color" id="menuSelection">
<option value="Black">Black</option>
<option value="Blue">Blue</option>
<option value="Red">Red</option>
</select>
<br />
<label for="shout">Shout? </label>
<input type="checkbox" name="shout" id="shout" value="yes" />
<br />
<label for="password">Password: </label>
<input type="password" name="password" id="password" size="40" />
<br />
<!-- BUTTON BELOW (like one in Mini-Lab #3) IS FOR TESTING.
EVENTUALLY IT SHOULD BE A SUBMIT BUTTON INSTEAD. -->
<input type="submit" name="submit" value="Submit Test"
onclick="showTestResults();" />
</form>
<hr />
<h2 id='testResultsHeading'></h2>
<p id="testResults"></p>
<script>
function showTestResults()
{
var element;
var outputHeading = document.getElementById("testResultsHeading");
var outputParagraph = document.getElementById("testResults");
// Print heading
outputHeading.innerHTML = "Test Results";
outputParagraph.innerHTML = "";
// Print form element name/value pairs
element = document.getElementById("userName");
outputParagraph.innerHTML += element.name + ": " + element.value + "<br />";
element = document.getElementById("option1");
outputParagraph.innerHTML += element.name + ": " + element.value + "; ";
outputParagraph.innerHTML += "checked = " + element.checked + "<br />";
element = document.getElementById("option2");
outputParagraph.innerHTML += element.name + ": " + element.value + "; ";
outputParagraph.innerHTML += "checked = " + element.checked + "<br />";
element = document.getElementById("option3");
outputParagraph.innerHTML += element.name + ": " + element.value + "; ";
outputParagraph.innerHTML += "checked = " + element.checked + "<br />";
element = document.getElementById("topic");
outputParagraph.innerHTML += element.name + ": " + element.value +
"<br />";
element = document.getElementById("message");
outputParagraph.innerHTML += element.name + ": " + element.value +
"<br />";
element = document.getElementById("color");
outputParagraph.innerHTML += element.name + ": " + element.value +
"<br />";
element = document.getElementById("shout");
outputParagraph.innerHTML += element.name + ": " + element.value + "; ";
outputParagraph.innerHTML += "checked = " + element.checked + "<br />";
}
</script>
</body>
</html>