Customer Input Based Price Change

Ask the community
,
1

Hi,

I am trying to create a service page in which a client can select the amount of tickets.
As in the screenshot below, the client can select a total number of adults, children and infants via Drop down list of numbers.

I want the total price to change accordingly by a pre-determined price per ticket (different for adults and children) which could be input into the code.

I’m not asking you to do the exact code but I will be very grateful if you could point me in the right direction where I could gather information or learn how to code this.

1366×768 125 KB

Thank you for any advice.

2

If you want to sum the values it’s pretty easy.
just add values to the dropdowns from dropdown option( set values ).
then
lets say dropdown1= num of adults where the values are assigned.
same goes for dropdown2 and 3.

 const totalprice =  (Number($w('#dropdown1').value)*40) + (Number($w('#dropdown2').value)*20)+ Number($w('#dropdown3').value);//maybe dont add dropdown3 since infants don't have fares.
    $w('#totalprice').text =String(totalprice);
3

Thanks for your help Amit but I already tried something like this and just now I tried your code but its not working.

933×329 35.6 KB

4

you have to use onChange events for the dropdown

$w.onReady( function ()  {
getsum();
});


function getsum()  {
    const totalprice =  (Number($w('#dropdown1').value)*40) + (Number($w('#dropdown2').value)*20);
    $w('#text5').text =String(totalprice);
        
}

export function dropdown1_change() {
	getsum();
}

export function dropdown2_change() {
	getsum();
}