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
bottom of page