damienoneill2001
damienoneill2001

Reputation: 499

Sum checkboxes and select options together

I am hoping to add the values of multiple select options and also checkboxes together using jQuery but have got a little stuck. My primary issue is that I receive NaN as my combined answer.

I initially just summed dropdowns which worked (an example can be found at http://pure.evolvedublin.com/phone) but now need to add checkboxes into the mix (as seen at http://pure.evolvedublin.com/broadband-phone).

When you click the Start button on both pages, the values become available.

I have tried using the solutions found in jQuery checkbox and select - sum the values and add in var and jQuery update initial price on click on checkbox that has data-price attribute but have not been able to get them working.

My jsfiddle with a sample of my code is here: http://jsfiddle.net/damienoneill2001/77Hhd/

I am using the following code to add the checkboxes, but just dont have it right:

jQuery('input:checkbox').change(function(){
    tot=0;
    jQuery('input:checkbox:checked').each(function(){
    tot+=parseFloat(jQuery(this).val());
});
tot+=parseFloat(document.getElementById("broadband_package").value)+parseFloat(document.getElementById("irish_mobile_package").value)+parseFloat(document.getElementById("intl_landline_package").value)+parseFloat(document.getElementById("intl_mob_package").value);
    jQuery('.cost-container').text(tot);
    jQuery('.cost-containerb').val(tot);
});

jQuery('.broad .irish_mob').change(function(){
    jQuery('input:checkbox').trigger('change');
});

The values should also only add to the total when the Add button is pressed.

Can anyone see where I am going wrong?

Upvotes: 1

Views: 148

Answers (1)

Andrew
Andrew

Reputation: 5083

The following values return undefined when I first check something:

document.getElementById("intl_landline_package").value
document.getElementById("intl_mob_package").value

This is because these are divs, not selects, so value is undefined. You will need to loop through the checkboxes in these divs and add up their values individually.

Upvotes: 1

Related Questions