Warenkorb Symbol fügt das Buch zum Warenkorb hinzu

buch_details.php

@@ -168,7 +168,10 @@
                                     </script>
                                 </div>
                             </div>
-                            <div class='shoppingCart_container'>
+                            <!--TODO: OnClick Event auslagern-->
+                            <div class='shoppingCart_container' 
+                                id='shoppingCart$bookID'
+                                onclick='addBookToCart(this.id)'>
                                 <div class='shoppingCart'></div>
                             </div>
                         </div>
@@ -200,6 +203,33 @@
 
     <!------------------------------------------------------------------------->
 
+    <!-- TODO: Auslagern (falls möglich) -->
+    <script>
+        function addBookToCart(ID) {
+            // OnClick Event für open_bookDetails stoppen
+            if (!e) var e = window.event;
+            e.cancelBubble = true;
+            if (e.stopPropagation) e.stopPropagation();
+
+            // ID abtrennen
+            ID = ID.replace('shoppingCart', '');
+            alert(ID);
+
+            var request = new XMLHttpRequest();
+            request.open('POST', 
+                'http://141.19.142.11/warenkorb_funktionen.php', true);
+            // TODO: Handler erstellen
+            request.onload = function() {
+                console.log(this.responseText);
+            }
+            request.setRequestHeader('Content-type', 
+                'application/x-www-form-urlencoded');
+            request.send(`function=addBookToCart&id=${ID}`);
+        }
+    </script>
+
+    <!------------------------------------------------------------------------->
+
     <!--Link JS file-->
     <script src="burgerIcon.js"></script>
     <!--If it was small and got big, 

buecher.php

@@ -151,7 +151,10 @@
                                     </script>
                                 </div>
                             </div>
-                            <div class='shoppingCart_container'>
+                            <!--TODO: OnClick Event auslagern-->
+                            <div class='shoppingCart_container' 
+                                id='shoppingCart$bookID'
+                                onclick='addBookToCart(this.id)'>
                                 <div class='shoppingCart'></div>
                             </div>
                         </div>";
@@ -182,6 +185,28 @@
                    data.toString();
                location.href = url;
            }
+
+           function addBookToCart(ID) {
+                // OnClick Event für open_bookDetails stoppen
+                if (!e) var e = window.event;
+                e.cancelBubble = true;
+                if (e.stopPropagation) e.stopPropagation();
+
+                // ID abtrennen
+                ID = ID.replace('shoppingCart', '');
+                alert(ID);
+
+                var request = new XMLHttpRequest();
+                request.open('POST', 
+                    'http://141.19.142.11/warenkorb_funktionen.php', true);
+                // TODO: Handler erstellen
+                request.onload = function() {
+                    console.log(this.responseText);
+                }
+                request.setRequestHeader('Content-type', 
+                    'application/x-www-form-urlencoded');
+                request.send(`function=addBookToCart&id=${ID}`);
+            }
        </script>
    
            <!--Link JS file-->

suchergebnisse.php

@@ -188,7 +188,7 @@
                     if ($counter != 0) {
                         echo "<div class='divider'></div>";
                     }
-                    // TODO: OnClick auslagern. 
+                    // TODO: OnClick Event auslagern
                     echo "<div id='book_container$bookID' class='book_container' 
                             onclick='open_bookDetails(this.id)'>
                             <div class='bookCover_container'>
@@ -231,7 +231,10 @@
                                     </script>
                                 </div>
                             </div>
-                            <div class='shoppingCart_container'>
+                            <!--TODO: OnClick Event auslagern-->
+                            <div class='shoppingCart_container' 
+                                id='shoppingCart$bookID'
+                                onclick='addBookToCart(this.id)'>
                                 <div class='shoppingCart'></div>
                             </div>
                         </div>";
@@ -253,16 +256,37 @@
 
     <!------------------------------------------------------------------------->
 
-    <!-- Auslagern (falls möglich) -->
+    <!-- TODO: Auslagern (falls möglich) -->
     <script>
         function open_bookDetails(ID) {
             var data = new URLSearchParams();
             data.append("bookID", ID);
-
             var url = "http://141.19.142.11/buch_details.php?" + 
                         data.toString();
             location.href = url;
         }
+
+        function addBookToCart(ID) {
+            // OnClick Event für open_bookDetails stoppen
+            if (!e) var e = window.event;
+            e.cancelBubble = true;
+            if (e.stopPropagation) e.stopPropagation();
+
+            // ID abtrennen
+            ID = ID.replace('shoppingCart', '');
+            alert(ID);
+
+            var request = new XMLHttpRequest();
+            request.open('POST', 
+                'http://141.19.142.11/warenkorb_funktionen.php', true);
+            // TODO: Handler erstellen
+            request.onload = function() {
+                console.log(this.responseText);
+            }
+            request.setRequestHeader('Content-type', 
+                'application/x-www-form-urlencoded');
+            request.send(`function=addBookToCart&id=${ID}`);
+        }
     </script>
 
     <!------------------------------------------------------------------------->