forked from NITRR-Open-Source-Community/NOSC-Website
-
Notifications
You must be signed in to change notification settings - Fork 0
/
feedbackform.html
105 lines (87 loc) · 3.43 KB
/
feedbackform.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><meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Event Feedback</title>
<link
href="https://fonts.googleapis.com/css2?family=Delius+Unicase:wght@700&family=Lobster&family=Lora:ital@0;1&family=Noto+Serif:ital@1&family=Roboto+Serif:ital,opsz,wght@1,8..144,100&family=Roboto+Slab&family=Source+Sans+Pro:ital,wght@0,600;1,600&display=swap"
rel="stylesheet"
/>
<style>
h1 {
background-color: rgb(196, 255, 208);
border-bottom: 14px solid #058da8;
text-align: center;
padding: 15px;
}
body {
background-color: azure;
font-family: 'Source Sans Pro', sans-serif;
}
form {
max-width: 500px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
label {
font-weight: bold;
}
input[type="text"],
input[type="radio"],
textarea {
resize: vertical;
}
input[type="submit"] {
background-color: #058da8;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #057a8f;
}
</style>
</head>
<body>
<h1>EVENT FEEDBACK FORM😊😒😁</h1>
<form action="/submit-feedback" method="POST" id="feedback-form">
<label for="event">Event Name:</label>
<input type="text" id="event" name="event" required>
<p>How would you rate the event overall?</p>
<input type="radio" id="rating-excellent" name="rating" value="Excellent">
<label for="rating-excellent">Excellent</label><br>
<input type="radio" id="rating-good" name="rating" value="Good">
<label for="rating-good">Good</label><br>
<input type="radio" id="rating-average" name="rating" value="Average">
<label for="rating-average">Average</label><br>
<input type="radio" id="rating-poor" name="rating" value="Poor">
<label for="rating-poor">Poor</label><br>
<p>What did you like most about the event?</p>
<textarea id="liked-most" name="liked-most" rows="4" cols="50" required></textarea>
<p>What suggestions do you have for improvement?</p>
<textarea id="suggestions" name="suggestions" rows="4" cols="50"></textarea>
<input type="submit" value="Submit" >
</form>
<script>
document.getElementById("feedback-form").addEventListener("submit", function (e) {
e.preventDefault();
if (
document.getElementById("event").value &&
document.querySelector('input[name="rating"]:checked') &&
document.getElementById("liked-most").value
) {
alert("Feedback submitted successfully!");
window.location.href = "https://nosc.netlify.app/events";
} else {
alert("Please fill in all required fields.");
}
});
</script>
</body>
</html>