Poi hinzufügen per Popup Formular

components/ShowAddStationPopup.js

@@ -28,12 +28,23 @@ const ShowAddStationPopup = ({ map, latlng }) => {
 
   const handleSubmit = (event) => {
     event.preventDefault();
-    console.log("Daten von ShowAddStationPopup: ", { 
+    const formData = { 
       name, // Name der Station
       poiTypeId, // Typ der Station, logged as idPoiTyp
       latitude, // Breitengrad
       longitude, // Längengrad
-    });
+     };
+
+    fetch('/api/addLocation', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(formData),
+    })
+    .then((response) => response.json())
+    .then((data) => console.log(data)) // Handle the response data
+    .catch((error) => console.error(error)); // Handle any errors
+
+    // Close the popup
     //map.closePopup();
   };
 

pages/api/addLocation.js

@@ -11,23 +11,20 @@ const dbConfig = {
 
 export default function handler(req, res) {
   if (req.method === "POST") {
-    const { name, type, latitude, longitude } = req.body;
+    const { name, poiTypeId, latitude, longitude } = req.body;
+    console.log("Received data:", req.body); // Überprüfen der empfangenen Daten
     const connection = mysql.createConnection(dbConfig);
 
-    // Nutze ST_GeomFromText, um den Punkt zu erzeugen
-    const query =
-      "INSERT INTO poi (description, idPoiTyp, position) VALUES (?, ?, ST_GeomFromText(?))";
-    const point = `POINT(${longitude} ${latitude})`; // Achte auf die Reihenfolge: Längengrad (Longitude), Breitengrad (Latitude)
-    const values = [name, type, point];
+    const query = "INSERT INTO poi (description, idPoiTyp, position) VALUES (?, ?, ST_GeomFromText(?))";
+    const point = `POINT(${longitude} ${latitude})`;
+    const values = [name, poiTypeId, point]; // Stellen Sie sicher, dass poiTypeId korrekt ist
 
     connection.query(query, values, (error, results) => {
       connection.end();
-
       if (error) {
         console.error("Fehler beim Einfügen des Standorts:", error);
         return res.status(500).json({ error: "Ein Fehler ist aufgetreten" });
       }
-
       res.status(200).json({ id: results.insertId, message: "Standort erfolgreich hinzugefügt" });
     });
   } else {
@@ -35,3 +32,4 @@ export default function handler(req, res) {
     res.status(405).end(`Method ${req.method} Not Allowed`);
   }
 }
+