User // Add an event listener to each dropdown box $w.onReady(function () { $w('#basePriceDropdown').onChange(() => calculateTotalPrice()); $w('#edgingDropdown').onChange(() => calculateTotalPrice()); $w('#weatherproofingDropdown').onChange(() => calculateTotalPrice()); $w('#hangingDropdown').onChange(() => calculateTotalPrice()); $w('#postageDropdown').onChange(() => calculateTotalPrice()); }); // Function to calculate the total price function calculateTotalPrice() { const basePriceOptions = { 35: 35, 40: 40, 45: 45, 50: 50, 55: 55, 60: 60, 65: 65, 70: 70, 75: 75, 80: 80, 85: 85, 90: 90, 95: 95, 100: 100, 105: 105, 110: 110, 115: 115, 120: 120, 125: 125, 130: 130, 135: 135, 140: 140, 145: 145, 150: 150, 155: 155, 160: 160, 165: 165, 170: 170, 175: 175, 180: 180, 185: 185, 190: 190, 195: 195, 200: 200, 205: 205, 210: 210, 215: 215, 220: 220, 225: 225, 230: 230, 235: 235, 240: 240, 245: 245, 250: 250, 255: 255, 260: 260, 265: 265, 270: 270, 275: 275, 280: 280, 285: 285, 290: 290, 295: 295, 300: 300, 305: 305, 310: 310, 315: 315, 320: 320, 325: 325, 330: 330, 335: 335, 340: 340, 345: 345, 350: 350, 355: 355, 360: 360, 365: 365, 370: 370, 375: 375, 380: 380, 385: 385, 390: 390, 395: 395, 400: 400, 405: 405, 410: 410, 415: 415, 420: 420, 425: 425, 430: 430, 435: 435, 440: 440, 445: 445, 450: 450, 455: 455, 460: 460, 465: 465, 470: 470, 475: 475, 480: 480, 485: 485, 490: 490, 495: 495, 500: 500, 505: 505, 510: 510, 515: 515, 520: 520, 525: 525, 530: 530, 535: 535, 540: 540, 545: 545, 550: 550, 555: 555, 560: 560, 565: 565, 570: 570, 575: 575, 580: 580, 585: 585, 590: 590, 595: 595, 600: 600, 605: 605, 610: 610, 615: 615, 620: 620, 625: 625, 630: 630, 635: 635, 640: 640, 645: 645, 650: 650 }; const edgingOptions = { 0: 0, 10: 10, 15: 15, 20: 20, 25: 25, 30: 30, 35: 35, 40: 40, 45: 45, 50: 50 }; const weatherproofingOptions = { 0: 0, 10: 10, 15: 15, 20: 20, 25: 25, 30: 30, 35: 35, 40: 40, 45: 45, 50: 50 }; const hangingOptions = { 0: 0, 15: 15, 20: 20, 25: 25, 30: 30 }; const postageOptions = { 15: 15, 20: 20, 25: 25, 30: 30, 35: 35, 40: 40, 45: 45, 50: 50, 55: 55, 60: 60, 65: 65, 70: 70, 75: 75, 80: 80, 85: 85, 90: 90, 95: 95, 100: 100 }; const basePrice = basePriceOptions[parseInt($w('#basePriceDropdown').value)]; const edgingPrice = edgingOptions[parseInt($w('#edgingDropdown').value)]; const weatherproofingPrice = weatherproofingOptions[parseInt($w('#weatherproofingDropdown').value)]; const hangingPrice = hangingOptions[parseInt($w('#hangingDropdown').value)]; const postagePrice = postageOptions[parseInt($w('#postageDropdown').value)]; const totalPrice = basePrice + edgingPrice + weatherproofingPrice + hangingPrice + postagePrice; // Display the total price on the page $w('#totalPriceDisplay').text = 'Final Price: $' + totalPrice.toFixed(2); }
top of page

$0.00

bottom of page