Update app.py

app.py

@@ -119,7 +119,7 @@ def create_modal_window():
     for add_on in add_ons:
         add_ons_html += f"""
         <label>
-            <input type="checkbox" name="biryani-extra" value="{add_on['Name']}" data-price="{add_on['Price__c']}" />
+            <input type="number" name="biryani-extra-quantity" value="1" min="1" style="width: 50px;" data-name="{add_on['Name']}" data-price="{add_on['Price__c']}" />
             {add_on['Name']} + ${add_on['Price__c']}
         </label>
         """
@@ -177,12 +177,13 @@ def modal_js():
             const price = parseFloat(document.getElementById('modal-price').innerText.replace('$', ''));
             const quantity = parseInt(document.getElementById('quantity').value) || 1;
             const instructions = document.getElementById('special-instructions').value;
-            const extras = Array.from(document.querySelectorAll('input[name="biryani-extra"]:checked')).map(extra => ({
-                name: extra.value,
-                price: parseFloat(extra.getAttribute('data-price') || '0')
+            const extras = Array.from(document.querySelectorAll('input[name="biryani-extra-quantity"]')).map(extra => ({
+                name: extra.getAttribute('data-name'),
+                price: parseFloat(extra.getAttribute('data-price')),
+                quantity: parseInt(extra.value)
             }));
-            const extrasCost = extras.reduce((total, extra) => total + extra.price, 0);
-            const totalCost = (price + extrasCost) * quantity;
+            const extrasCost = extras.reduce((total, extra) => total + extra.price * extra.quantity, 0);
+            const totalCost = (price * quantity) + extrasCost;
 
             // Add the item to the cart
             cart.push({ name, price, quantity, extras, instructions, totalCost });
@@ -203,7 +204,7 @@ def modal_js():
             cartItemsContainer.innerHTML = "";
 
             cart.forEach((item, index) => {
-                const extrasList = item.extras.map(extra => `${extra.name} (+$${extra.price.toFixed(2)})`).join(', ');
+                const extrasList = item.extras.map(extra => `${extra.name} x${extra.quantity} (+$${(extra.price * extra.quantity).toFixed(2)})`).join(', ');
                 cartItemsContainer.innerHTML += `
                     <div style="border: 1px solid #ddd; padding: 10px; margin-bottom: 10px; border-radius: 8px;">
                         <h3>${item.name}</h3>