I am trying to do math with Javascript, it will run calculation from one input (monthly salary) to result (tax) as following:
Deduction from annual income (12000)
here comes the hard part, tax is calculated in different levels, so if annual is between 6500 and 25000, tax should be 10%. And if there is more left after 25000 and less than 40000, tax should be 15% added to the previous 10%, and so on.
EX. if annual is 60000, the math will be like this:
60000 - 12000 = 48000 // deduction
25000 X (10/100) = 2500 // 10% tax on 6500-25000 range
48000 - 25000 = 23000 // first cut 25000
23000 X (15/100) = 3450 // 15% tax on 25000-40000 range
total tax will be 2500 + 3450 = 5950
Code:
<input type=text id="salary">
<div id="total"></div>
<script>
function calc(){
var salary = document.getElementById('salary').value;
var annual = salary * 12;
var net = annual - 12000;
// Define Tax brackets
var bracket1 = (10 / 100);
var bracket2 = (15 / 100);
if (net >= 6500){
if ( net >= 6500 && net <= 25000 ) {
var tax1 = (net * bracket1);
}
else if ( net >= 30000 && net <= 40000 ) {
var tax2 = (net * bracket2);
}
var result = (tax1 + tax2) / 12; //monthly tax
document.getElementById('total').innerHTML = result ;
}
</script>
So output comes as NaN, I am not sure if what I have done so far is the right thing or variables inside statement is the problem here.
The algorithm itself seems to be... buggy (you might want to review
it), but, assuming some things myself, this works. Try running it and
see what you can improve.
<html>
<head>
<title>TAX</title>
</head>
<script type="text/javascript">
function calc(){
var result, tax1 = 0, tax2 = 0;
var salary = document.getElementById('salary').value;
var annual = salary * 12;
var net = annual - 12000;
// Define Tax brackets
var bracket1 = (10 / 100);
var bracket2 = (15 / 100);
if (net >= 6500) {
if (net >= 6500 && net <= 25000) {
tax1 = (net * bracket1);
}
else if (net >= 30000 && net <= 40000) {
tax2 = (net * bracket2);
}
result = (tax1 + tax2) / 12; // monthly tax
}
document.getElementById('total').innerHTML = result;
console.log(result);
}
</script>
<body>
<input type=text id="salary" onblur="calc();" value="0" />
<div id="total"></div>
</body>
</html>
There was a missing };
using var inside the if declarations is not a common practice, so I declared them in a bigger scope (calc() for this matter);
I assumed the line if (net = 30000 && net <= 40000) was about net >= 30000, but... your call;
The way it is now, either tax1 or tax2 will be setted. One of them will be zero. That's because of the if/else statements, they are confusing.
ps.: also, you might wanna use the parseFloat, as stated by some, considering the 'incoming' is not always an integer;
pps: I added a value="" in the input so it is - somewhat - defined at all times.
With the example given, this code might help you get started on the logic.
function calc(){
var salary = document.getElementById('salary').value;
var annual = salary * 12;
var net = annual - 12000;
console.log(salary, annual, net);
// Define Tax brackets
var bracket1 = (0.1);
var bracket2 = (0.15);
var tax1 = 0;
var tax2 = 0;
var runningNet = net;
if (net >= 6500){
if (net >= 25000) {
tax1 = 2500; // 2500 * 0.10, max tax on bracket 1
runningNet = runningNet - 25000;
tax2 = runningNet * bracket2; // whatever is left over * bracket2
}
else {
tax1 = runningNet * bracket1;
}
var result = (parseFloat(tax1) + parseFloat(tax2));
var monthly = result / 12; //monthly tax
document.getElementById('total').innerHTML = result ;
document.getElementById('monthly').innerHTML = monthly ;
}
}
<input type="text" id="salary" />
<button type="button" onclick="calc()">Calculate</button>
<br/>
Total: <div id="total"></div>
Monthly: <div id="monthly"></div>
Related
I am trying to code a calculator which will give me a cost per square metre.
At the moment, I have the calculator working and producing a cost for the square meterage, however, what I want to try and do is have if statements, so that if the area comes back less than 15 m², the cost is worked out (area * 2000) and if the area comes back more than 15 m² it is worked out as (area star * 1750)
Any help would be greatly appreciated.
My code is currently
function calculateCost() {
var width = document.getElementById("width").value;
var depth = document.getElementById("depth").value;
var area = width * depth;
var totalCost = area * 2000
document.getElementById("result").innerHTML = "Total cost: £" + totalCost;
}
<form>
Width in Metres: <input type="text" id="width"><br> Depth in Metres: <input type="text" id="depth"><br>
<input type="button" value="Calculate" onclick="calculateCost()">
</form>
<div id="result"></div>
Instead of
var totalCost = area * 2000
write
var totalCost = area * (area <= 15 ? 2000 : 1750);
Now you will have price = area * 2000 for area less or equal than 15, and discount for higher areas.
A few answers were giving using the ternary operator, which were short and succinct, but I would argue they're not the most readable.
Effectively, you have a number (be it 2000 or 1750) that you need to multiply your the area with to get your total cost. You could start off by giving this a name. Say, costMultiplier.
We can assign it with the value 2000 to begin with (which assumes the area is less than 15m2).
var costMultiplier = 2000;
Now, you just need to check if the area is greater than 15m2. And if it is, you update costMultiplier accordingly.
if (area > 15) {
costMultiplier = 1750;
}
Finally, you can update your totalCost like this
var totalCost = area * costMultiplier
If there are any other conditions under which the cost multiplier might change, you could just add an else if branch to the if statement.
You need just to add a condition on the area value:
function calculateCost() {
var width = document.getElementById("width").value;
var depth = document.getElementById("depth").value;
var area = width * depth;
var totalCost = (area < 15) ? area * 2000 : area * 1750;
document.getElementById("result").innerHTML = "Total cost: £" + totalCost;
}
<form>
Width in Metres: <input type="text" id="width"><br> Depth in Metres: <input type="text" id="depth"><br>
<input type="button" value="Calculate" onclick="calculateCost()">
</form>
<div id="result"></div>
I can't seem to finish this. I know how to find out if the number is divisible by 3 but once I get above 3 how do I keep the discount plus the remainder? Example: 7 tickets cost $120
$20 each or 3 for $50
<input id="raffleTix" type="text" value="0" />
if($('#raffleTix').val() % 3 == 0){
raffle = ($('#raffleTix').val() / 3) * 50;
}else if($('#raffleTix').val() < 3){
raffle = $('#raffleTix').val() * 20;
}else{
}
There is no need to have any conditional logic. This can be done with a simple formula:
var value = $('#raffleTix').val();
var setsOfThree = Math.floor(value / 3);
var singles = value - setsOfThree * 3;
raffle = setsOfThree * 50 + singles * 20;
Or even better, it could all be placed in a function so that different values could be passed without modifying the code:
function computeCost(quantity, setSize, setCost, singleCost) {
var sets = Math.floor(quantity / setSize);
var singles = quantity - sets * setSize;
return sets * setCost + singles * singleCost;
}
raffle = computeCost($('#raffleTix').val(), 3, 50, 20);
I am creating a simple form that calculates price based on quantity ordered and tax. I also want to apply a discount for the following quantities:
10-19: 10% discount
20-29: 20% discount
30-39: 30 % discount
40-99: 40 % discount
My issue is that the function still returns the total price without the discount for a certain quantity. When the quantity entered is in a certain range, I have set it up so that the discount updates to the appropriate percentage (var discountPrice). If a discount is applied, then the total should update to the discountedTotal, and calculate the tax and final total from there. However, there seems to be an issue with my syntax since none of this is being applied to the function when I run it.
Any insight as to why the if/else statement or the function as a whole is not running properly would be appreciated. If needed, here is the full HTML/JS: http://jsfiddle.net/pas0tmpL/
function priceCalculation() {
var nameFirst = document.getElementById("first_name").value;
var nameLast = document.getElementById("last_name").value;
var phoneNum = document.getElementById("phone_number").value;
var quantity = document.getElementById("quantity_order").value;
var price = document.getElementById("price_fixed").value;
var total = quantity * price;
var discountPrice = 0
var discountedTotal = total - (total * discountPrice);
const taxRate = 0.085;
var tax = total * taxRate;
var totalPlusTax = total + tax;
if (quantity > 9 || quantity < 20) {
discountPrice = .10;
total = discountedTotal;
}
else if (quantity > 19 || quantity < 30) {
discountPrice = .20;
total = discountedTotal;
}
else if (quantity > 29 || quantity < 40) {
discountPrice = .30;
total = discountedTotal;
}
else if (quantity > 39 || quantity < 100) {
discountPrice = .40;
total = discountedTotal;
}
document.getElementById("order_total").value = "$" + totalPlusTax.toFixed(2);
Like this:
function priceCalculation() {
var nameFirst = document.getElementById("first_name").value;
var nameLast = document.getElementById("last_name").value;
var phoneNum = document.getElementById("phone_number").value;
var quantity = document.getElementById("quantity_order").value;
var price = document.getElementById("price_fixed").value;
var total = quantity * price;
var discountPrice = 0 ;
var discountedTotal = 0;
const taxRate = 0.085;
var tax = total * taxRate;
var totalPlusTax = total + tax;
if (quantity > 9 || quantity < 20) {
discountPrice = .10;
total = total - (total * discountPrice);
}
else if (quantity > 19 || quantity < 30) {
discountPrice = .20;
total = total - (total * discountPrice);
}
else if (quantity > 29 || quantity < 40) {
discountPrice = .30;
total = total - (total * discountPrice);
}
else if (quantity > 39 || quantity < 100) {
discountPrice = .40;
total = total - (total * discountPrice);
}
document.getElementById("order_total").value = "$" + totalPlusTax.toFixed(2);
} // end function priceCalculation();
You have several problems that I can see. One is, you calculate the discountedTotal at the beginning using
var discountPrice = 0
var discountedTotal = total - (total * discountPrice);
total - (total * 0) will just give you total. You should probably only set discountedTotal after you know what your discountPrice is...
Your if statements have some problems also. As a hint, || means "or". Thus your first if is saying "if the quantity is more than 9 or less than 20"--and every integer in existence is either more than 9 or less than 20 (some are both!). So you'll only ever attempt to apply the first discount, and that to everything.
Good luck!
I'm working on the classic "making change" problem, which is highly documented in plenty of other languages, but there's not much out there for it in Javascript. So far, I have this:
var total = $('#total').val();
var coins = [];
function makeChange(total, coins) {
var remainder = 0;
if (total % 0.25 < total) {
coins[3] = parseInt(total / 0.25);
remainder = total % 0.25;
total = remainder;
}
if (total % 0.10 < total) {
coins[2] = parseInt(total / 0.10);
remainder = total % 0.10;
total = remainder;
}
if (total % 0.05 < total) {
coins[1] = parseInt(total / 0.05);
remainder = total % 0.05;
total = remainder;
}
coins[0] = parseInt(total / 0.01);
}
function showChange(coins) {
if (coins[3] > 0) {
$('.quarter').html(coins[3] + " quarter(s).");
}
if (coins[2] > 0) {
$('.dime').html(coins[2] + " dime(s).");
}
if (coins[1] > 0) {
$('.nickel').html(coins[1] + " nickel(s).");
}
if (coins[0] > 0) {
$('.penny').html(coins[0] + " pennies.");
}
}
makeChange(total, coins);
showChange(coins);
However, this seems awfully repetitive and I'm finding that with certain values, it's a penny off. How can I make it more accurate and concise?
I'm finding that with certain values, it's a penny off.
Probably due to floating-point issues. And you shouldn't use parseInt to convert a number - it's meant for strings.
this seems awfully repetitive
A loop, with a data structure that represent the different coins will help. You already did something like that for your result: coins is an array, not 4 different variables.
function makeChange(total, values) {
var coins = [],
epsilon = 1e-5; // this is wrong in general!
// assume values are ascending, so we loop backwards
for (var i=values.length; i--; ) {
coins[i] = Math.floor(total / values[i].val + epsilon);
total %= values[i].val;
}
return coins;
}
function showChange(coins, values) {
for (var i=values.length; i--; ) {
var el = $(values[i].sel);
if (coins[i] > 0) {
el.html(coins[i] + " "+values[i].name+".");
} else {
el.empty();
}
}
}
var values = [
{val:0.01, sel:'.penny', name:"pennies"},
{val:0.05, sel:'.nickel', name:"nickel(s)"},
{val:0.10, sel:'.dime', name:"dime(s)"},
{val:0.25, sel:'.quarter', name:"quarter(s)"}
];
showChange(makeChange(parseFloat($('#total').val()), values), values);
Your best bet to avoid rounding problems is to just multiple your total by 100 to convert your dollar amount into all pennies, then do you conversion. For example:
function makeChange(total, coins) {
var remainder = 0;
total = Math.round(total * 100);
coins[3] = Math.floor(total / 25);
remainder = total - coins[3] * 25;
total = remainder;
coins[2] = Math.floor(total / 10);
remainder = total - coins[2] * 10;
total = remainder;
coins[1] = Math.floor(total / 5);
remainder = total - coins[1] * 5;
total = remainder;
coins[0] = total;
}
http://jsfiddle.net/t14cwdph/4/
For making your code easier to manage - see #Bergi's answer.
How do I get cart checkout price exact to the penny using Javascript?
Right now after taking out all of the trial .rounds etc I was trying.. I am coming up 1.5 cents too high using a high 15 products/prices to test.
for (var i = 0; i < Cookie.products.length; i++) {
boolActive = Cookie.products[i].og_active;
if (boolActive)
{
itemPrice = Cookie.products[i].price;
itemQty = Cookie.products[i].quantity;
itemDiscountPercent = Cookie.products[i].discount_percent;
subtotal = itemPrice * itemQty;
priceDiscount = (subtotal * itemDiscountPercent);
discountAmount += priceDiscount;
}
}
if (!isNaN(discountAmount))
{
var newCartTotal = (cartTotal - priceDiscount);
alert("New Cart Total: " + newCartTotal);
}
var newCartTotal = (cartTotal - pricediscount).toFixed(2)
that will give you the value, but it will be a string. If you need it to stay numeric, use:
var newCartTotal = ((cartTotal - pricediscount * 100) << 0) / 100;
You need to round the discount for each line item: priceDiscount = round_to_hundredth(subtotal * itemDiscountPercent)
Note that this result may not agree with the result you'd get if you add the unrounded results and then round the sum. However, this is the way invoices usually work when calculated by hand (especially since each item can have a different discount percent, so the discount is calculated for each line).
I think you left out a line saying discountAmount += priceDiscount.
modify your code to :
priceDiscount = parseFloat( (subtotal * itemDiscountPercent).toFixed(2) );
and:
newCartTotal = parseFloat( (cartTotal - priceDiscount).toFixed(2) );