Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Menu</title> | |
| </head> | |
| <body> | |
| <h1>Welcome to the Menu</h1> | |
| <div id="menu"> | |
| {% for item in menu_items %} | |
| <div class="menu-item"> | |
| <h2>{{ item.name }}</h2> | |
| <p>Price: ${{ item.price }}</p> | |
| <p>Ingredients: {{ item.ingredients }}</p> | |
| <p>Category: {{ item.category }}</p> | |
| <button onclick="orderItem('{{ item.name }}')">Order</button> | |
| </div> | |
| {% endfor %} | |
| </div> | |
| <script> | |
| function orderItem(itemName) { | |
| let quantity = prompt("How many would you like to order?"); | |
| fetch("/order", { | |
| method: "POST", | |
| headers: { | |
| "Content-Type": "application/json" | |
| }, | |
| body: JSON.stringify({ "item_name": itemName, "quantity": quantity }) | |
| }) | |
| .then(response => response.json()) | |
| .then(data => { | |
| alert(data.message); | |
| }) | |
| .catch(error => console.error("Error placing order:", error)); | |
| } | |
| </script> | |
| </body> | |
| </html> | |