jQuery problem - simple checkbox calculation
Ok Guys and Girls I need your help. Should be simple but I am not seeing clearly at the moment.
What I want to do is when a checkbox is clicked the discount price gets removed from the current total. If I have rounded up figures like below 35.00 and the discount price 15.00 it works ok. Clicking and unclicking the checbox functions. As soon as I use something like 35.50 and 15.50 it goes haywire. I know its something to to with parseInt( ) rounding down the numbers BUT if I remove that then not even the rounded up figures work.
Full test code below. There's probably a better way to do this.
<!DOCTYPE html >
<html>
<head>
<meta charset="UTF-8" />
<title>Price Discount</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
// CHANGE PRICING FOR CHILD PRICE
$(document).ready(function() {
$('.select_child').click(function() {
if($(this).is(':checked')) {
var child_discount = $('.child_discount').val();
var current_total = $('.total span').text();
var new_total = current_total - child_discount;
$('.total span').text(new_total.toFixed(2));
}
else {
var child_discount = parseInt($('.child_discount').val());
var current_total = parseInt($('.total span').text());
new_total = current_total + child_discount;
$('.total span').text(new_total.toFixed(2));
}
});
});
</script>
</head>
<body>
<div class="child_price" style="padding: 15px 25px;">
<input type="checkbox" title="select_child" class="select_child" value="child">Select if Child (under 16) - Concession Price £20.00
<input type="text" title="child_discount" name="child_discount" class="child_discount" value="15.00">
</div>
<!-- end child_price -->
<p class="total">TOTAL £<span>35.00</span></p>
<!-- end total -->
</body>
</html>
AdChoices