I need to output sales tax and total using a subtotal and its tax rate
I am able to output sales tax but im not sure how to get it to output tax rate as well
here is what I have:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sales Tax Calculator</title>
<link rel="stylesheet" href="sales_tax.css" />
</head>
<body>
<main>
<h1>Sales Tax Calculator</h1>
<p>Enter Subtotal and Tax Rate and click "Calculate".</p>
<div>
<label for="subtotal">Subtotal:</label>
<input type="text" id="subtotal" >
</div>
<div>
<label for="tax_rate">Tax Rate:</label>
<input type="text" id="tax_rate" >
</div>
<div>
<label for="sales_tax">Sales Tax:</label>
<input type="text" id="sales_tax" disabled >
</div>
<div>
<label for="total">Total:</label>
<input type="text" id="total" disabled >
</div>
<div>
<label></label>
<input type="button" id="calculate" value="Calculate" >
<input type="button" id="clear" value="Clear" >
</div>
</main>
<script src="sales_tax.js"></script>
</body>
</html>
...
"use strict";
const $ = selector => document.querySelector(selector);
const getErrorMsg = val => `${val} must be a valid number greater than zero.`;
const focusAndSelect = selector => {
const elem = $(selector);
elem.focus();
elem.select();
};
const processEntries = () => {
const subtotal = parseFloat($("#subtotal").value);
const taxrate = parseFloat($("#tax_rate").value);
if (isNaN(subtotal) || subtotal <= 0) {
alert(getErrorMsg("Subtotal"));
focusAndSelect("#subtotal");
} else if (isNaN(taxrate) || taxrate <= 0) {
alert(getErrorMsg("tax rate"));
focusAndSelect("#tax_rate");
}
else {
$("#sales_tax").value = (subtotal * taxrate) / 100;
$("#total").value = (subtotal + salestax);
}
}
document.addEventListener("DOMContentLoaded", () => {
$("#calculate").addEventListener("click", processEntries);
$("#subtotal").focus() ;
});
code is not fully completed but all i can get it to output is the sales tax and im not sure how to get it to output the total
