I have a simple checkbox code, 2 checkboxes per group.
<div class='product-addon'>
<p>Interfejsy</p>
<label>
<input id='option0' type='checkbox' name='Interfejsy' value='150.00'>
Moduł rozszerzenia 1: 2x RS232 <span class='addon-price'>150,00</span>
</label>
<label>
<input id='option1' type='checkbox' name='Interfejsy' value='370.67'>
Moduł rozszerzenia 2: WiFi <span class='addon-price'>370,67</span>
</label>
</div>
<div class='product-addon'>
<p>BAZA</p>
<label>
<input id='option0' type='checkbox' name='BAZA' value='60.00'>
Rozszerzenie bazy PLU o 2000 kodów <span class='addon-price'>60,00</span>
</label>
<label>
<input id='option1' type='checkbox' name='BAZA' value='80.00'>
Rozszerzenie bazy PLU o 4000 kodów <span class='addon-price'>80,00</span>
</label>
</div>
My question is: How i can get total sum of price (checkbox.val()) when user click checkbox? For example user click checkbox in first group with value=150.00, and click checkbox in second group with value=80.00? Total sum should be 230.00 Important: user can select only one checkbox in group.
I have that js code:
var totalSum = 0;
$("input:checkbox").on('click', function() {
var $box = $(this);
if ($box.is(":checked")) {
var group = "input:checkbox[name='" + $box.attr("name") + "']";
var addonPrice = parseFloat($box.val());
$(group).prop("checked", false);
$box.prop("checked", true);
} else {
$box.prop("checked", false);
}
totalSum += addonPrice;
console.log(totalSum);
});
but the variable totalSum is always getting higher, when i click any addon. For example i click checkbox in group 1 with value=150, next click checkbox in group 2 with value=60, totalSum = 210 it's good, but when i click again some checkbox it's adding next value.
I just wan't something like this: 1) User click checkbox in group 1 with value=150 2) User click checkbox in group 2 with value=60 3) totalSum is 210 4) User click checkbox in group 2 with value=80 5) totalSum is 230, not 290
Thanks for any suggestions
Aucun commentaire:
Enregistrer un commentaire