Javascript Calculator Help

[onyx trench]

Hello, I am making a commission calculator for a client. I have basic functionality down but the ability to combine multiple options does not work. What am I doing wrong?

let selectedPrice = 0;

function updateCalc(){
    if (ecCheck.checked){
        ecValue.disabled = false;
    } else if (!ecCheck.checked){
        ecValue.disabled = true;
    }

    const type = priceMenu.value;
    
    switch (type) {
        case "line":
            selectedPrice = 40;
        break;
        case "mono":
            selectedPrice = 80;
        break;
        case "daki":
            selectedPrice = 350;
        break;
        case "flat":
            selectedPrice = 100;
        break;
    }
    const extraRevCost = ( 10 / 100) * Number(selectedPrice);
    const rushPercentageResult = ( 40 / 100) * Number(selectedPrice);
    const ecPercentageResult = ( 10 / 100) * Number(selectedPrice) * ecValue.value;;
    
    if (rushCheck.checked){
        currentPrice(rushPercentageResult);
        console.log(total)
    } else if (ecCheck.checked) {
        currentPrice(ecPercentageResult);
        console.log(total)
    } else if (extraRev.checked){
        currentPrice(extraRevCost);
        console.log(total)
    } else if (commercialRights.checked) {
        currentPrice(75)
        console.log(total)
    }
    else {
        total = selectedPrice;
    }
    
    return calcResult.textContent = total;
}

function currentPrice(calculatedFees){
    return total = calculatedFees + selectedPrice;
}```

[granite ravine]

The problem is in your cascade of if...else statements, as it will only execute the FIRST condition that it finds a match for. If you want it to match any combination of those checkboxes, you just need individual if statements. Does this make sense?

[onyx trench]

I will try that. Thank you Michael 🙂 That would make sense because the problem I'm having with stacking features is the first feature in the If:Else executes and stops everything else

[bitter shell]

1. if you use if ... else if ..., it means only one of them will be chosen. in this case, it should be individual if without else
2. don't update variable total in function currentPrice return, but inside the if block. for example you can use total += rushPercentageResult

here is my updated version of your code, I removed currentPrice function since I don't need it anymore
||```
let selectedPrice = 0;

function updateCalc(){
if (ecCheck.checked){
ecValue.disabled = false;
} else if (!ecCheck.checked){
ecValue.disabled = true;
}

const type = priceMenu.value;

switch (type) {
    case "line":
        selectedPrice = 40;
    break;
    case "mono":
        selectedPrice = 80;
    break;
    case "daki":
        selectedPrice = 350;
    break;
    case "flat":
        selectedPrice = 100;
    break;
}
const extraRevCost = ( 10 / 100) * Number(selectedPrice);
const rushPercentageResult = ( 40 / 100) * Number(selectedPrice);
const ecPercentageResult = ( 10 / 100) * Number(selectedPrice) * ecValue.value;;

let total = selectedPrice
if (rushCheck.checked){
    total += rushPercentageResult
    console.log(total)
}
if (ecCheck.checked) {
    total += ecPercentageResult
    console.log(total)
}
if (extraRev.checked){
    total += extraRevCost
    console.log(total)
}
if (commercialRights.checked) {
    total += 75
    console.log(total)
}

calcResult.textContent = total;

}

[onyx trench]

Thank you both- Stu, your code works!

I feel so stupid for spending all day on this and the problem was 'else if' 😅

But I don't understand why the currentPrice function updating Total wasn't working. Can someone please explain?

[bitter shell]

have you declared the total variable before you use it in any place?
like let total = or const total = ...

[onyx trench]

I didn't. But even without total being declared as empty in the global scope first, as a function it takes the parameter of the declared Total from the if-chain, so why was I having problems? Can anyone explain? I want to learn and understand better for next time. Thank you

[bitter shell]

okay. so, you are planning to use global scope variable for total.
the answer is like Michael said earlier, using if ... else ... or if ... else if ... else ..., will make the code choose the first if that match the condition, and then execute that code block inside the if.

here is an example I create in jsfiddle, hope it helps you understand a little more.
https://jsfiddle.net/pbk9zgr5/1/