Skip to content

Commit bd1af4c

Browse files
mdazfar2mdazfar2
authored
Merge pull request #259 from Ayushmaanagarwal1211/main
Feedback form
2 parents 9a22147 + f84195b commit bd1af4c

1 file changed

Lines changed: 84 additions & 33 deletions

File tree

‎Official_Website/index.html‎

Lines changed: 84 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@
1010
<link rel="shortcut icon" href="Favicon.png" type="image/x-icon" />
1111
<link rel="stylesheet" href="dark_mode.css" />
1212
<link rel="stylesheet" href="navstyle.css" />
13+
<script type="text/javascript"
14+
src="https://cdn.jsdelivr.net/npm/@emailjs/browser@4/dist/email.min.js">
15+
</script>
1316
</head>
1417
<body>
1518
<header class="header">
@@ -77,19 +80,19 @@ <h1>HelpOps-Hub</h1>
7780
</div>
7881
<div id="feedback-section">
7982
<h2>Feedback</h2>
80-
<form class="feedback-form" id="feedback-form">
83+
<form class="feedback-form" id="feedback-form">
8184
<label for="name">Name</label>
8285
<input type="text" id="name" name="name" required />
8386

8487
<label for="email">Email</label>
85-
<input type="email" id="email" name="email" required />
88+
<input type="email" id="email" name="user_email" required />
8689

8790
<label for="comments">Comments</label>
88-
<textarea id="comments" name="comments" required></textarea>
91+
<textarea id="comments" name="message" required></textarea>
8992

9093
<label for="rating">Rating</label>
9194
<div class="rating">
92-
<input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="1 star">&#9733;</label>
95+
<label for="star1" title="1 star">&#9733;</label> <input type="radio" id="star1" name="rating" value="1" />
9396
<input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="2 stars">&#9733;</label>
9497
<input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="3 stars">&#9733;</label>
9598
<input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="4 stars">&#9733;</label>
@@ -110,11 +113,46 @@ <h2>Feedback</h2>
110113

111114
<script src="app.js"></script>
112115
<script src="darkmode.js"></script>
116+
<script type="text/javascript">
117+
(function(){
118+
emailjs.init({
119+
publicKey: "rId2aw03Pj2ZNq2U5",
120+
});
121+
})();
122+
</script>
123+
<script>
124+
document.getElementById("feedback-form").reset();
125+
126+
</script>
113127
<script>
114128
// Feedback JS
115129
document.getElementById("feedback-form").addEventListener("submit", function(event) {
116130
event.preventDefault();
117-
131+
var rating = document.querySelector('input[name="rating"]:checked').value
132+
if (!rating) {
133+
var errorMessage = document.getElementById("error-message");
134+
errorMessage.innerText = "Please select a Rating!";
135+
errorMessage.style.display = "block";
136+
setTimeout(function() {
137+
errorMessage.style.display = "none";
138+
}, 3000);
139+
return;
140+
}
141+
let temp=document.getElementById('comments').value
142+
document.getElementById('comments').value= `Comments : ${document.getElementById("comments").value} Rating : ${document.querySelector('input[name="rating"]:checked').value}`;
143+
144+
emailjs.sendForm('service_hrz8hfg', 'template_na7xjc4',"#feedback-form").then(
145+
(response) => {
146+
console.log('SUCCESS!', response.status, response.text);
147+
},
148+
(error) => {
149+
console.log('FAILED...', error);
150+
},
151+
);
152+
document.getElementById('comments').value= temp
153+
154+
155+
118156
if (!document.querySelector('input[name="rating"]:checked')) {
119157
var errorMessage = document.getElementById("error-message");
120158
errorMessage.innerText = "Please select a rating!";
@@ -130,34 +168,47 @@ <h2>Feedback</h2>
130168
comments: document.getElementById("comments").value,
131169
rating: document.querySelector('input[name="rating"]:checked').value
132170
};
133-
console.log(formData);
134-
fetch('https://helpops-hub.vercel.app/feedback', {
135-
method: 'POST',
136-
headers: {
137-
'Content-Type': 'application/json'
138-
},
139-
body: JSON.stringify(formData)
140-
})
141-
.then(response => response.json())
142-
.then(data => {
143-
console.log('Success:', data);
144-
document.getElementById("message").innerText = "Thank you for your feedback!";
145-
document.getElementById("message").style.display = "block";
146-
setTimeout(function() {
147-
document.getElementById("message").style.display = "none";
148-
document.getElementById("feedback-form").reset();
149-
}, 3000);
150-
})
151-
.catch((error) => {
152-
console.error('Error:', error);
153-
var errorMessage = document.getElementById("error-message");
154-
errorMessage.innerText = "There was an error submitting your feedback.";
155-
errorMessage.style.display = "block";
156-
setTimeout(function() {
157-
errorMessage.style.display = "none";
158-
}, 3000);
159-
});
160-
});
171+
// fetch('https://helpops-hub.vercel.app/feedback', {
172+
// method: 'POST',
173+
// headers: {
174+
// 'Content-Type': 'application/json'
175+
// },
176+
// body: JSON.stringify(formData)
177+
// })
178+
// .then(response => response.json())
179+
// .then(data => {
180+
// console.log('Success:', data);
181+
// document.getElementById("message").innerText = "Thank you for your feedback!";
182+
// document.getElementById("message").style.display = "block";
183+
// setTimeout(function() {
184+
// document.getElementById("message").style.display = "none";
185+
// document.getElementById("feedback-form").reset();
186+
// }, 3000);
187+
// })
188+
// .catch((error) => {
189+
// console.error('Error:', error);
190+
// var errorMessage = document.getElementById("error-message");
191+
// errorMessage.innerText = "There was an error submitting your feedback.";
192+
// errorMessage.style.display = "block";
193+
// setTimeout(function() {
194+
// errorMessage.style.display = "none";
195+
// }, 3000);
196+
// });
197+
var messageElement = document.getElementById("message");
198+
messageElement.innerText = "Thank you for your feedback!";
199+
messageElement.style.display = "block";
200+
201+
setTimeout(function() {
202+
messageElement.style.display = "none";
203+
document.getElementById("feedback-form").reset();
204+
}, 3000);
205+
206+
207+
208+
209+
210+
211+
});
161212
</script>
162213
</body>
163214
</html>

0 commit comments

Comments
 (0)