Display first value unless checkbox is checked, then calculate

So I spent many hours working on a dynamic Booking form. I manage to get the hide and show functions to work as I want and that the values change according to the chosen Radio button. For the next step I want to calculate the values. But I want to first display the Value of the Radio. Then when the user checks a checkbox, add the value of each checked checkbox to the value of the Radio. I managed to get the function of adding all checked boxes and add that to the radio value.

        var sum1;
    $('input[name=price]').change(function() {
        sum1 = $('input[name=price]:checked').val();
    });
    $('input[name=custompak]').change(function() {
        var sum2 = 0;
        $('input[name=custompak]:checked').each(function() {
        sum2 += parseInt($(this).prop('value'));
    });
      document.getElementById('finalprice').innerHTML = parseInt(sum1) + parseInt(sum2);
    });

This is the JSFiddle of the Complete form: https://jsfiddle.net/mullern/2cr91vvq/2/

FYI, the rest of the JS code changes the value depending on the Customertype selection and it also hides the checkboxes of the products already included in the bundle.

My goal is to Display the price of the Packages shown in the radiogroup when one is selected. Then when one or more checkboxes are selected, that value gets added to the value of the radiogroup selection.

On a sidenote I was also not able to figure out how to display the Value when the page is loaded so the user sees the default selection value when they open the contact form.

I hope this isn't to confusing and thank you in advance for any help on my problem.

Answers 1

  • Take a look at this [fiddle][1], Try clicking on radio button under packages. You are suppose to write code on click event. I also tried to minimize your code by calling method , check line 13 to 22.

     [1]: https://jsfiddle.net/2cr91vvq/3/
    

Related Articles