STUCK WITH CALCULATION!!!

Guys, im a business owner, i dont know how to code, but im trying to because you gotta do what you gotta do. Below is what I have done:

export function numofcoke_change(event) {
let NumofCoke = $w(‘#numofcoke’).value;
let PriceofCoke = Number(120);
$w(‘#totalpriceofcoke’).text = (NumofCokePriceofCoke).toString();
let TotalSumC = $w(‘#totalpriceofcoke’).text;
}
export function numofsprite_change(event) {
let NumofSprite = $w(‘#numofsprite’).value;
let PriceofSprite = Number(120);
$w(‘#totalpriceofsprite’).text = (NumofSprite
PriceofSprite).toString();
let TotalSumS = $w(‘#totalpriceofsprite’).text
}
export function numofwater_change(event) {
let NumofWater = $w(‘#numofwater’).value;
let PriceofWater = Number(85);
$w(‘#totalpricew’).text = (NumofWater*PriceofWater).toString();
}

Now where im getting stuck is that i need to add the “totalpriceofcoke” and "totalpriceofsprite and “totalpricew”. I tried write below the script $w (‘#totalsum’).text = (adding all the above with + signs) but that doesnt work. it doesnt pick it up as its in a different function.
I also tried somehow taking them to the global area on the top but it doesnt pick it up there either. I DONT KNOW WHAT TO DO…HOW DO I CALCULATE THE SUM OF ALL THESE AND WHERE DO I PUT WHAT IN WHAT PART OF THE SCRIPT. I also tried adding a bracket open to the top and then write the code and bracket closed at bottom but that dont work either. PLEASE HELP ME!!!..

You can try:

const inputs = [
    {id: "numofcoke", price:  120, total: 0, textElement:  "totalpriceofcoke"},
    {id: "numofsprite", price:  120,  total: 0, textElement: "totalpriceofsprite"},
    {id: "numofwater", price:  85,  total: 0, textElement:  "NumofWater"}
];
const selector = inputs.reduce((a, c) => a + `#${c.id},`, "");
$w.onReady(() => {
$w(selector).onChange(event => {
    let currentInput = inputs.find(e =>  e.id  === event.target.id );
    if($w("#" + currentInput.id).value){
        currentInput.total = $w("#" + currentInput.id).value *         currentInput.price;
        $w("#" + currentInput.textElement).text =  currentInput.total.toString();
    } else {
        currentInput.total = 0;
        $w("#" + currentInput.textElement).text = "";
    }
    $w("#totalpricew").text = inputs.reduce((a,c) => a + c.total, 0)).toString();
    })
})

i tried what you gave even it its quiet alien to me what what i need to do, so i copy pasted it. that didnt work, so i started to change a few things around. When i copy past it it mentions that eventTarget.id is not defined. I dont know what to do after that…let me just show you the whole thing…:

export function numofbiryani_change(event) {
let Numofbiryani = $w(‘#numofbiryani’).value;
let biryaniprice1kg = Number(800);
$w(‘#totalpriceof1kg’).text = (Numofbiryanibiryaniprice1kg).toString();
}
export function numofbiryani2_change(event) {
let Numofbiryani2 = $w(‘#numofbiryani2’).value;
let biryanipricehalf = Number(500);
$w(‘#totalpriceofhalfkg’).text = (Numofbiryani2
biryanipricehalf).toString();
console.log(numofbiryani2_change(event));
}
export function numofraita_change(event) {
let NumofRaita = $w(‘#numofraita’).value;
let PriceofRaita = Number(60);
$w(‘#totalpriceofraita’).text = (NumofRaitaPriceofRaita).toString();
let TotalSumR = $w(‘#totalpriceofraita’).text;
}
export function numofcoke_change(event) {
let NumofCoke = $w(‘#numofcoke’).value;
let PriceofCoke = Number(120);
$w(‘#totalpriceofcoke’).text = (NumofCoke
PriceofCoke).toString();
let TotalSumC = $w(‘#totalpriceofcoke’).text;
}
export function numofsprite_change(event) {
let NumofSprite = $w(‘#numofsprite’).value;
let PriceofSprite = Number(120);
$w(‘#totalpriceofsprite’).text = (NumofSpritePriceofSprite).toString();
let TotalSumS = $w(‘#totalpriceofsprite’).text
console.log(TotalSumS);
}
export function numofwater_change(event) {
let NumofWater = $w(‘#numofwater’).value;
let PriceofWater = Number(85);
$w(‘#totalpricew’).text = (NumofWater
PriceofWater).toString();
}

Now what i want is something like this: my text field for the total price is id: #totalsum

I want #totalsum = totalpricew +totalpriceofsprite + totalpriceofcoke + all the other ones…

To fix that typo in JD’s code try changing eventTarget.id to event.target.id

Yes. Sorry for that.

and if you want you can just modify your code:

let sumCoke = 0, sumSprite = 0, sumSprite = 0;
function sumupAll(){
let total = sumCoke + sumSprite + sumSprite ;
$w('#totalPrice').text = total.toString();
}
export function numofcoke_change(event) {
let NumofCoke = Number($w('#numofcoke').value);
let PriceofCoke = 120;
sumCoke = NumofCoke*PriceofCoke;
$w('#totalpriceofcoke').text = sumCoke.toString();
sumupAll();
}
export function numofsprite_change(event) {
let NumofSprite = Number($w('#numofsprite').value);
let PriceofSprite = 120;
sumSprite = NumofSprite*PriceofSprite;
$w('#totalpriceofsprite').text = sumSprite.toString();
sumupAll();
}
export function numofwater_change(event) {
let NumofWater = Number($w('#numofwater').value);
let PriceofWater = 85;
sumWater = NumofWater*PriceofWater;
$w('#totalpricew').text = sumWater.toString();
sumupAll();
}

IT WORKED! THE INITIAL CODE WHEN CHANGING THE EVENT TARGET THING WORKED!!! OMG!!! YES YES YES!!! YOU PEOPLE ARE FUCKING AWESOME!!!

Hey guys, so im kind of stuck with a similat issue. Ive done the same thing as above, but in different light boxes:

Lightbox 1 ones takes in Number of Dishes
Lightbox 2 takes in Sides
Lightbox 3 takes in number of Drinks
Light box 4 is total

Now when i use the initial code provided by @jonatandor35 I changed that event part and it worked. Now when i past that on the Page section of the editor for Light Box 1, 2 and 3. everything works fine, it showws me a total of each specific product but when i get to the last Lightbox (4) where it is supposed to me show the TOTAL of all the things chosen it gives an error saying $w (…) onChange is not a function. (Picture below). I suspect that this is mainly due to the fact that before the #numberofproducts being chosen were from a “slider” now they are a “dropdown”. What do i need to change in my code and where do i need to put this in order to make it work. below is the code being used:

const inputs = [
{id: “numberofcoke”, price: 120, total: 0, textElement: “totalpriceofcoke”},
{id: “numberofsprite”, price: 120, total: 0, textElement: “totalpriceofsprite”},
{id: “numberofwater”, price: 85, total: 0, textElement: “totalpricew”},
{id: “numberofraita”, price: 50, total: 0, textElement: “totalpriceofraita”},
{id: “numberofbiryani2”, price: 500, total: 0, textElement: “totalpriceofhalfkg”},
{id: “numberofbiryani1”, price: 800, total: 0, textElement: “totalpriceof1kg”}
];

$w.onReady(() => {
$w(inputs.reduce((a, c) => a + #${c.id},, “”)).onChange(event => {
let currentInput = inputs.find(e => e.id === event.target.id );
if($w(“#” + currentInput.id).value){
currentInput.total = $w(“#” + currentInput.id).value * currentInput.price;
$w(“#” + currentInput.textElement).text = currentInput.total.toString();
} else {
currentInput.total = 0;
$w(“#” + currentInput.textElement).text = “”;
}
$w(‘#totalsum’).text = inputs.reduce((a,c) => a + c.total, 0).toString();
})
})

This is the error:

its also not even letting me pick up (‘#totalsum’) when that is clearly an id on the page…

PLEASE HELP!

The lightbox’s code and object are sperate from the code and objects of the page. So you can’t just use the code as is.
You’ll need to pass the input from the lightbox to the page and then use it (without onChange() function). To do that you’ll manage the opening and closing of the lightbox using code (and not via the editor or the native close button which you’ll have to remove).
See here:
https://www.wix.com/corvid/reference/wix-window.html#openLightbox
and:
https://www.wix.com/corvid/reference/wix-window.lightbox.html#close