Skip to content Skip to sidebar Skip to footer

Jquery + Add Up Checkbox Values

I have a page with a number of checkboxes. Each Checkbox is for a different item (virtual Rose) and rose has a different value. I have put the value of the rose into the value=''

Solution 1:

You could loop over the checkboxes and add their values.

var total = 0;
$(':checkbox:checked.giftsRosesCheckBox').each(function() {
    total += +this.value;
});

jsFiddle.

If you didn't have to support older browsers (or shim reduce()), you could do it in a more functional way...

var total = $(':checkbox:checked.giftsRosesCheckBox')
            .get()
            .reduce(function(total, checkbox) {
                 return total + +checkbox.value;
             }, 0);

jsFiddle.

Solution 2:

$(".giftsRosesCheckBox").click(function() {
    var total = 0;
    $(".giftsRosesCheckBox:checked").each(function() {
        total += parseInt($(this).val(), 10);
    });
    alert(total);
});

Solution 3:

var total =0;
$('input[type=checkbox].giftsRosesCheckBox, input[checked=checked].giftsRosesCheckBox').each(function(){
total += this.val();
});

Post a Comment for "Jquery + Add Up Checkbox Values"