Hey all I am trying to update this code I have. It pretty much does what I need it to except one thing. Well two technically, but mostly one I am concerned with. When I check off the boxes I want, it adds up like it is supposed to and adds 5% on top like its supposed to, however it puts the answer in the value of my submit button. How can I stop this from happening? Second (and less important for now) How can I make that total value return as a dollar amount with only 2 decimal points, so instead of returning 0.924 it returns $.92 for example. Thanks!
<body>
<h1> The Fruit Form</h1>
<form action="" name="form1" id="form1">
<input type="checkbox" id='fruit0' value=".59" >Apples ( .59)<br>
<input type="checkbox" id='fruit1' value=".49">Oranges (.49)<br>
<input type="checkbox" id='fruit2' value=".39">Bananas(.39)<br>
<input type="submit" onclick="UpdateCost()" id="totalcost" value="Submit">
</form>
<script type="text/javascript">
function UpdateCost() {
var sum = 0;
var fid, elem;
for (i=0; i<3; i++) {
fid = 'fruit'+i;
elem = document.getElementById(fid);
if (elem.checked == true) { sum += Number(elem.value); }
}
document.getElementById('totalcost').value = sum.toFixed(2)*1.05;
alert("Your Total Is:" + totalcost.value);
return false
}
</script>
</body>
Your submit-button's id is totalcost
and your function gets the element with the id totalcost
:
document.getElementById('totalcost').value = sum.toFixed(2)*1.05;
So you can prevent this by not doing this.
Instead of sum.toFixed(2)*1.05
you should do (sum * 1.05).toFixed(2)
as was commented by PSL.
Instead, update your variable:
sum = (sum * 1.05).toFixed(2);
or create a new variable say total
:
var total = (sum * 1.05).toFixed(2);
or just process it where you output the value:
alert( (sum * 1.05).toFixed(2) );
Extra:
Since you are working with money up to 2 decimal points, I'd like to make you aware of the fact that in javascript 0.1+0.2 is NOT 0.3!
The best way to avoid that is to multiply all numbers by the accuracy you need and devide the final (sub-) result by that precision on output.
So: (52 cents + 18 cents = 70 cents) / 100 = 0.7 (and here you'd use toFixed
so it becomes 0.70 ).
Just some code comments:
If can get a reference to the form if you pass this to the function:
<input type="submit" onclick="UpdateCost(this)" ...>
In the function:
function UpdateCost(element) {
var sum = 0;
var fid, elem;
Store a reference to the form:
var form = element.form;
for (i=0; i<3; i++) {
fid = 'fruit'+i;
elem = document.getElementById(fid);
The above can be:
elem = form[fid];
if (elem.checked == true) {
sum += Number(elem.value);
}
And that can be:
sum += elem.checked? +elem.value : 0;
where the unary +
will convert the value to a number.
}
document.getElementById('totalcost').value = sum.toFixed(2)*1.05;
becomes:
form.totalcost.value = '$' + (sum * 1.05).toFixed(2);
HTH.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.