JSFiddle - React, Tailwind, and code Playground

by lasha

JavaScript

var submitBtn = document.getElementById("submitBtn");
var resultBox = document.querySelector(".math-result");
var mathOperator;
var discountType;

function doTheMath(operator, value1, value2){
    var mathResult;
    value1 = parseInt(value1);
    value2 = parseInt(value2);
    
    switch(operator) {
        case 'add':
            console.log("add");
            mathResult = value1 + value2;
            break;
        case 'subtract':
            console.log("sub");
            mathResult = value1 - value2;
            break;
        case 'divide':
            console.log("divide");
            mathResult = value1 / value2;
            break;
        case 'multiply':
            console.log("multiply");
            mathResult = value1 * value2;
            break;
        default:
            alert("please select operator");
    }
    
    return mathResult;
}

function doTheDiscount(discountType, discountValue, subTotal){


    switch(discountType) {
        case 'set-amount':
            //console.log("set amount");
            break;
        case 'set-percentage':
            //console.log("set percentage");
            break;
        case 'tier-amount':
            //console.log("tier amount");
            break;
        case 'tier-percentage':
            //console.log("tier percentage");
            break;
        default:
            alert("please select discount type");
    }
}

submitBtn.onclick = function(e){
    // The "|| 0" means... if <input id="value1"> is empty/null, default to 0
    // You can add a isNaN() check to see if someone entered a string, and then set it to 0, too.
    // Or, have an annoying alert() box pop up saying "NUMBERS ONLY!"
    var value1 = document.getElementById("value1").value || 0;
    var value2 = document.getElementById("value2").value || 0;
    var taxVal = document.getElementById("taxPercent").value || 0;
    var discount = document.getElementById("discount").value || 0;
    
    mathOperator =...