-
Notifications
You must be signed in to change notification settings - Fork 0
/
studentRegister.html
137 lines (129 loc) · 5.12 KB
/
studentRegister.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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> Student Registeration </title>
<style>
Body {
font-family: Calibri, Helvetica, sans-serif;
background-color: #EEEEEE;
}
button {
background-color: #388E3C;
width: 100%;
color: orange;
padding: 15px;
margin: 10px 0px;
border: none;
cursor: pointer;
}
select,
span,
input[type=text],
input[type=email],
input[type=date],
input[type=password] {
width: 100%;
margin: 15px 0;
padding: 12px 20px;
display: inline-block;
border: 2px solid #388E3C;
box-sizing: border-box;
}
button:hover {
opacity: 0.7;
}
.container {
padding: 25px;
margin: auto;
width: 50%;
background-color: E0E0E0;
}
</style>
</head>
<body>
<center>
<h1> Student Registeration Form </h1>
</center>
<form method="POST">
<div class="container">
<label>Username : </label>
<input type="text" placeholder="Enter Username" name="username" required>
<label>Password : </label>
<input type="password" placeholder="Enter Password" name="password" required>
<label>First Name : </label>
<input type="text" placeholder="Enter Your First Name" name="firstname" required>
<label>Last Name : </label>
<input type="text" placeholder="Enter Your Last Name" name="lastname" required>
<label>Email : </label>
<input type="email" placeholder="Enter Your Email" name="email" required>
<label>Birthdate : </label>
<input type="date" placeholder="Enter Your Birth Date" name="birthdate" required>
<span>
<label> Gender : </label>
<input type="radio" id="male" name="gender" value="male" required>
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female" required>
<label for="female">Female</label>
</span>
<span>
<label>Choose The First Courses You Wanna Register</label>
<select name="course1" id="course1">
<option selected value></option>
</select>
</span>
<span>
<label>Choose The Second Courses You Wanna Register</label>
<select name="course2" id="course2">
<option selected value></option>
</select>
</span>
<span>
<label>Choose The Third Courses You Wanna Register</label>
<select name="course3" id="course3">
<option selected value></option>
</select>
</span>
<span>
<label>Choose The Fourth Courses You Wanna Register</label>
<select name="course4" id="course4">
<option selected value></option>
</select>
</span>
<span>
<label>Choose The Fifth Courses You Wanna Register</label>
<select name="course5" id="course5">
<option selected value></option>
</select>
</span>
<span>
<label>Choose The Sixth Courses You Wanna Register</label>
<select name="course6" id="course6">
<option selected value></option>
</select>
</span>
<button type="submit">Register</button>
</div>
</form>
<script>
var course1 = document.getElementById("course1");
var course2 = document.getElementById("course2");
var course3 = document.getElementById("course3");
var course4 = document.getElementById("course4");
var course5 = document.getElementById("course5");
var course6 = document.getElementById("course6");
fetch('/get')
.then(response => response.json())
.then(function (data) {
for (i = 0; i < data.length; i++) {
course1.innerHTML = course1.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
course2.innerHTML = course2.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
course3.innerHTML = course3.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
course4.innerHTML = course4.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
course5.innerHTML = course5.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
course6.innerHTML = course6.innerHTML + ('<option value="' + data[i] + '"' + ">" + data[i] + "</option>")
}
});
</script>
</body>
</html>