Spaces:
Running
Running
Update templates/menu_page.html
Browse files- templates/menu_page.html +11 -39
templates/menu_page.html
CHANGED
|
@@ -54,51 +54,23 @@
|
|
| 54 |
</head>
|
| 55 |
<body>
|
| 56 |
<h1>Restaurant Menu</h1>
|
| 57 |
-
<div class="menu-container"
|
| 58 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 59 |
</div>
|
| 60 |
|
| 61 |
<script>
|
| 62 |
-
// ✅ Fetch Menu from Flask API
|
| 63 |
-
function fetchMenu() {
|
| 64 |
-
fetch("/menu") // Calls Flask API
|
| 65 |
-
.then(response => response.json()) // Convert response to JSON
|
| 66 |
-
.then(data => {
|
| 67 |
-
if (data.success) {
|
| 68 |
-
let menuContainer = document.getElementById("menu-list");
|
| 69 |
-
menuContainer.innerHTML = ""; // Clear previous content
|
| 70 |
-
|
| 71 |
-
data.menu.forEach(item => {
|
| 72 |
-
let menuItem = document.createElement("div");
|
| 73 |
-
menuItem.classList.add("menu-item");
|
| 74 |
-
|
| 75 |
-
menuItem.innerHTML = `
|
| 76 |
-
<h3>${item.name}</h3>
|
| 77 |
-
<p><strong>Category:</strong> ${item.category}</p>
|
| 78 |
-
<p><strong>Price:</strong> $${item.price}</p>
|
| 79 |
-
<p><strong>Ingredients:</strong> ${item.ingredients}</p>
|
| 80 |
-
<button onclick="addToCart('${item.name}', ${item.price})">Add to Cart</button>
|
| 81 |
-
`;
|
| 82 |
-
|
| 83 |
-
menuContainer.appendChild(menuItem);
|
| 84 |
-
});
|
| 85 |
-
} else {
|
| 86 |
-
document.getElementById("menu-list").innerHTML = "<p>Error fetching menu.</p>";
|
| 87 |
-
}
|
| 88 |
-
})
|
| 89 |
-
.catch(error => {
|
| 90 |
-
console.error("Error fetching menu:", error);
|
| 91 |
-
document.getElementById("menu-list").innerHTML = "<p>Unable to load menu.</p>";
|
| 92 |
-
});
|
| 93 |
-
}
|
| 94 |
-
|
| 95 |
// ✅ Function to Add Items to Cart (Just a simple alert for now)
|
| 96 |
function addToCart(name, price) {
|
| 97 |
-
alert(
|
| 98 |
}
|
| 99 |
-
|
| 100 |
-
// ✅ Display Menu on Page Load
|
| 101 |
-
window.onload = fetchMenu;
|
| 102 |
</script>
|
| 103 |
</body>
|
| 104 |
</html>
|
|
|
|
| 54 |
</head>
|
| 55 |
<body>
|
| 56 |
<h1>Restaurant Menu</h1>
|
| 57 |
+
<div class="menu-container">
|
| 58 |
+
{% for item in menu %}
|
| 59 |
+
<div class="menu-item">
|
| 60 |
+
<h3>{{ item.name }}</h3>
|
| 61 |
+
<p><strong>Category:</strong> {{ item.category }}</p>
|
| 62 |
+
<p><strong>Price:</strong> ${{ item.price }}</p>
|
| 63 |
+
<p><strong>Ingredients:</strong> {{ item.ingredients }}</p>
|
| 64 |
+
<button onclick="addToCart('{{ item.name }}', {{ item.price }})">Add to Cart</button>
|
| 65 |
+
</div>
|
| 66 |
+
{% endfor %}
|
| 67 |
</div>
|
| 68 |
|
| 69 |
<script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 70 |
// ✅ Function to Add Items to Cart (Just a simple alert for now)
|
| 71 |
function addToCart(name, price) {
|
| 72 |
+
alert(name + " added to cart!");
|
| 73 |
}
|
|
|
|
|
|
|
|
|
|
| 74 |
</script>
|
| 75 |
</body>
|
| 76 |
</html>
|