JSFiddle - React, Tailwind, and code Playground

by Barry Margolin

HTML

<form name="shopping" action="#" method="post" onsubmit="return appleAlert()">
    <input type="checkbox" name="apple" id="apple" onclick="appleAlert()" />
    <label for="apple">Apple ($.59)</label>
    <input type="checkbox" name="orange" id="apple" onchange="orangeAlert()" />
    <label for="orange">Orange ($.49)</label>
    <input type="checkbox" name="banana" id="apple" onchange="bananaAlert()" />
    <label for="banana">Banana ($.39)</label>
    <input type="submit" value="Submit">
</form>

JavaScript

function appleAlert() {
    var selection = document.getElementById("apple");
    var total = 0;


    if (selection.checked) {
        total = 59;
        alert(total);
    } else {
        alert("Not checked");
    }

}

function orangeAlert() {
}
function bananaAlert() {
}