added api modal route and function for saving user feedback

backend/app.js

@@ -3,6 +3,7 @@ import dotenv from "dotenv";
 import connectDB from "./utils/db.js";
 import blogRoutes from "./routes/blogRoutes.js";
 import userRoutes from "./routes/userRoutes.js";
+import feedbackRoutes from "./routes/feebackroute.js";
 import cors from "cors";
 
 dotenv.config();
@@ -16,6 +17,7 @@ app.use(cors());
 
 app.use("/api/users", userRoutes);
 app.use("/api/blogs", blogRoutes);
+app.use("/api/feedback", feedbackRoutes);
 
 const PORT = process.env.PORT || 5000;
 app.listen(PORT, () => {

backend/controllers/feedbackcontroller.js

@@ -0,0 +1,24 @@
+import feedback from "../models/feedback.js";
+
+export async function saveFeedback(req, resp) {
+  try {
+    const { name, userfeedback, email, rating } = req.body;
+
+    if (!name || !userfeedback || !email || typeof rating !== "number") {
+      return resp.status(400).json({ message: "All fields are required." });
+    }
+
+    const newfeedback = new feedback({ name, userfeedback, email, rating });
+
+    // Save feedback to the database
+    await newfeedback.save();
+
+    // Respond with success message
+    resp
+      .status(201)
+      .json({ message: "Feedback saved successfully!", newfeedback });
+  } catch (error) {
+    console.error("Error saving feedback:", error);
+    resp.status(500).json({ message: "Failed to save feedback.", error });
+  }
+}

backend/models/feedback.js

@@ -0,0 +1,29 @@
+import { mongoose } from "mongoose";
+
+const feedbackSchema = new mongoose.Schema(
+  {
+    name: {
+      type: String,
+      required: true,
+      trim: true,
+    },
+    userfeedback: {
+      type: String,
+      required: true,
+      trim: true,
+    },
+    email: {
+      type: String,
+      required: true,
+    },
+    rating: {
+      type: Number,
+      required: true,
+    },
+  },
+  { timestamps: true }
+);
+
+const feedback = mongoose.model(" feedback", feedbackSchema);
+
+export default feedback;

backend/routes/feebackroute.js

@@ -0,0 +1,7 @@
+import express from "express";
+const router = express.Router();
+import { saveFeedback } from "../controllers/feedbackcontroller.js";
+
+router.post("/savefeedback", saveFeedback);
+
+export default router;

give_feedback.html

@@ -532,11 +532,62 @@ <h2 style="color: var(--text-color); font-size: 24px; margin-bottom: 20px">
         </div>
       </div>
 
-      <button type="button" onclick="SendEmail(event)" class="submitbtn">
+      <button type="button" onclick="saveFeedback(event)" class="submitbtn">
         Send
       </button>
     </form>
-
+
+
+    <!-- script to submit form -->
+    <script>
+      async function saveFeedback(event) {
+        event.preventDefault(); // Prevent form from reloading the page
+
+        // Get form data
+        const name = document.getElementById("Name").value;
+        const email = document.getElementById("email2").value;
+        const feedback = document.getElementById("message").value;
+        const rating = document.querySelector('input[name="rating"]:checked')?.value;
+
+        // Check if all fields are filled
+        if (!name || !email || !feedback || !rating) {
+          alert("Please fill out all fields and rate us.");
+          return;
+        }
+
+        // Prepare data object
+        const data = {
+          name,
+          userfeedback: feedback,
+          email,
+          rating: parseInt(rating),
+        };
+
+        try {
+          // Send data to the API
+          const response = await fetch('http://localhost:5000/api/feedback/savefeedback', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+          });
+
+          // Handle response
+          if (response.ok) {
+
+            document.getElementById("contactForm").reset(); // Reset form
+          } else {
+            const errorData = await response.json();
+
+          }
+        } catch (error) {
+          console.error("Error:", error);
+
+        }
+      }
+    </script>
+
     <!-- Custom popup -->
     <div class="overlay" id="overlay"></div>
     <div class="popup" id="popupMessage">