Backend added for feedback form and styles fixed

Author: RamakrushnaBiswal

Official_Website/.gitignore

@@ -0,0 +1,3 @@
+node_modules
+.env
+package-lock.json

Official_Website/index.html

@@ -113,32 +113,51 @@ <h2>Feedback</h2>
   <script>
     // Feedback JS
     document.getElementById("feedback-form").addEventListener("submit", function(event) {
-      event.preventDefault();
-
-      var name = document.getElementById("name").value;
-      var email = document.getElementById("email").value;
-      var comments = document.getElementById("comments").value;
-      var rating = document.querySelector('input[name="rating"]:checked');
-
-      if (!rating) {
-        var errorMessage = document.getElementById("error-message");
-        errorMessage.innerText = "Please select a Rating!";
-        errorMessage.style.display = "block";
-        setTimeout(function() {
-          errorMessage.style.display = "none";
-        }, 3000);
-        return;
-      }
-
-      var messageElement = document.getElementById("message");
-      messageElement.innerText = "Thank you for your feedback!";
-      messageElement.style.display = "block";
-
-      setTimeout(function() {
-        messageElement.style.display = "none";
-        document.getElementById("feedback-form").reset();
-      }, 3000);
-    });
+     event.preventDefault();
+     
+     if (!document.querySelector('input[name="rating"]:checked')) {
+         var errorMessage = document.getElementById("error-message");
+         errorMessage.innerText = "Please select a rating!";
+         errorMessage.style.display = "block";
+         setTimeout(function() {
+             errorMessage.style.display = "none";
+         }, 3000);
+         return;
+     }
+     const formData = {
+       name: document.getElementById("name").value,
+       email: document.getElementById("email").value,
+       comments: document.getElementById("comments").value,
+       rating: document.querySelector('input[name="rating"]:checked').value
+     };
+     console.log(formData);
+     fetch('http://127.0.0.1:3000/feedback', {
+         method: 'POST',
+         headers: {
+             'Content-Type': 'application/json'
+         },
+         body: JSON.stringify(formData)
+     })
+     .then(response => response.json())
+     .then(data => {
+         console.log('Success:', data);
+         document.getElementById("message").innerText = "Thank you for your feedback!";
+         document.getElementById("message").style.display = "block";
+         setTimeout(function() {
+             document.getElementById("message").style.display = "none";
+             document.getElementById("feedback-form").reset();
+         }, 3000);
+     })
+     .catch((error) => {
+         console.error('Error:', error);
+         var errorMessage = document.getElementById("error-message");
+         errorMessage.innerText = "There was an error submitting your feedback.";
+         errorMessage.style.display = "block";
+         setTimeout(function() {
+             errorMessage.style.display = "none";
+         }, 3000);
+     }); 
+ });
   </script>
 </body>
 </html>

Official_Website/index.js

@@ -0,0 +1,36 @@
+import express from 'express'; 
+import bodyParser from 'body-parser';
+import cors from 'cors';
+import mongoose from 'mongoose';
+const app = express();
+const port = 3000;
+import Feedback from './models/feedback.js';
+
+app.use(bodyParser.json());
+app.use(cors());
+
+const URL='mongodb://localhost:27017/feedbackGSSCO';
+
+const main = async()=>{
+    await mongoose.connect(URL)
+    .then(() => console.log("MongoDB connected"))
+    .catch((err) => console.log(err));
+}
+main()
+.catch((err) => console.log(err));
+
+app.post('/feedback', async(req, res) => {
+    const data = req.body;
+    // console.log(`Name: ${name}, Email: ${email}, Comments: ${comments}, Rating: ${rating}`);    
+    res.json({ status: 'success', message: 'Feedback submitted successfully' });
+
+    const feedback = new Feedback(data);
+    await feedback.save()
+    .then(() => console.log("Feedback submitted successfully"))
+    .catch((err) => console.log(err));
+
+});
+
+app.listen(port, () => {
+    console.log(`Server running at http://127.0.0.1:${port}`);
+});

Official_Website/models/feedback.js

@@ -0,0 +1,12 @@
+import mongoose from "mongoose";
+
+const Schema=mongoose.Schema;
+const feedbackSchema = new Schema({
+    name: String,
+    email: String,
+    comments: String,
+    rating: Number
+});
+const Feedback = mongoose.model('Feedback', feedbackSchema);
+
+export default Feedback;