Input value to change

Question

this is what I have now

$(document).ready(function() {
    var inputs = $('input[name="BPSUBPT"], input[name="BPSUPQ"]');
    $(inputs).click(function() {
        var total = 0;
        $(inputs).filter(':checked').each(function() {
            // Now including the - sign
            var value = ($(this).val()).match(/\$(-?[0-9]*)/)[1];
            if (value) {
                // I'm now ADDing the total
                // total = total + parseInt(value);
                total += parseInt(value);
            }
        });
        $('#total').html('$' + total);
          $('#BPSUBA').val('$' + total);
});
    $('input[name="BPSUBPT"]').click(function() {
        $(this).blur();
        $('#BPSUBPP').val($(this).val());
    })
    $('input[name="BPSUPQ"]').click(function() {
        $(this).blur();
        $('#BPSUDA').val($(this).val());
   });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<p>Baby Plan<br />
    <span class="wpcf7-form-control-wrap BPSUBPT"><span class="wpcf7-form-control wpcf7-radio radio-vertical" id="BPSUBPT"><span class="wpcf7-list-item first"><input type="radio" name="BPSUBPT" value="Baby Plan $300.00 3 Sessions" />&nbsp;<span class="wpcf7-list-item-label">Baby Plan $300.00 3 Sessions</span></span><span class="wpcf7-list-item last"><input type="radio" name="BPSUBPT" value="Baby Plan $500.00 4 Sessions" />&nbsp;<span class="wpcf7-list-item-label">Baby Plan $500.00 4 Sessions</span></span></span></span> </p>
<p>Did you have a Newborn session With ADP? <br />
<span class="wpcf7-form-control-wrap BPSUPQ"><span class="wpcf7-form-control wpcf7-radio radio-vertical" id="BPSUPQ"><span class="wpcf7-list-item first"><input type="radio" name="BPSUPQ" value="Yes $-150 off" />&nbsp;<span class="wpcf7-list-item-label">Yes $-150 off</span></span><span class="wpcf7-list-item last"><input type="radio" name="BPSUPQ" value="No $000.00" />&nbsp;<span class="wpcf7-list-item-label">No $000.00</span></span></span></span></p>
<p>Baby Plan Totals: <br />
Baby Plan Price: <span class="wpcf7-form-control-wrap BPSUBPP"><input type="text" name="BPSUBPP" value="" size="28" maxlength="28" class="wpcf7-form-control wpcf7-text" id="BPSUBPP" aria-invalid="false" /></span><br />
Discount Amount: <span class="wpcf7-form-control-wrap BPSUDA"><input type="text" name="BPSUDA" value="" size="10" maxlength="10" class="wpcf7-form-control wpcf7-text" id="BPSUDA" aria-invalid="false" /></span><br />
Balance Amount: <span class="wpcf7-form-control-wrap BPSUBA"><input type="text" name="BPSUBA" value="" size="8" maxlength="8" class="wpcf7-form-control wpcf7-text" id="BPSUBA" aria-invalid="false" /></span></p>
<p>Total Price: <span id="total"></span></p>

I am creating an membership form, using contact form 7, and I need to add a radio button menu for a reply to a question, and a corresponding input field, which will be subtracted, for the 'amount' from another set of radio buttons. Creating the order form is easy but now what I want is that I want the 'amount' value to be hidden till the responder click on the reply radio. and to change depending on which 'reply' has been selected from the 'reply' radio button has been selected. Let’s say that we've two options inside the 'which reply' radio buttons menu, namely:

1.Yes 2.No

<p>Did you have a Newborn session With ADP? <br />
[radio BPSUPQ id:BPSUPQ class:radio-vertical "Yes" "No"]

And that each reply has a corresponding amount set, for example:

1.Yes = -$150 (off) 2.NO = $000

Now what I want is that I want the input field for 'Discount amount' to show the different values when different options of reply are selected from the radio button. For example if the reply 'yes' is selected, then the value '-$150.00' should be shown in the text input field for amount and it should keep on changing depending on which option is selected.

Baby Plan Price: [text BPSUBPP 28/28 id:BPSUBPP]

I am presuming that this can be done using javascript but as I am fairly new to this, I am finding it a bit difficult. This is how the basic form would look like.

<p>Baby Plan<br />
[radio BPSUBPT id:BPSUBPT class:radio-vertical "Baby Plan $300.00 3 Sessions" "Baby Plan $500.00 4 Sessions"] </p>

<p>Did you have a Newborn session With ADP? <br />
[radio BPSUPQ id:BPSUPQ class:radio-vertical "Yes$ -150 off" "No"]


<p>Baby Plan Totals: <br />
Baby Plan Price: [text BPSUBPP 28/28 id:BPSUBPP]
Discount Amount: [text BPSUDA 8/8 id:BPSUDA]

Total Price: <span id="total"></span

Right now I have it work so it can be subtracted and to show the discount and my radio button looks like this.

    <p>Did you have a Newborn session With ADP? <br />
[radio BPSUPQ id:BPSUPQ class:radio-vertical "Yes $-150 off" "No"]

• yes $-150 off
• No

My java Script

<script>
$(document).ready(function() {
    var inputs = $('input[name="BPSUBPT"], input[name="BPSUPQ"]');
    $(inputs).click(function() {
        var total = 0;
        $(inputs).filter(':checked').each(function() {
            // Now including the - sign
            var value = ($(this).val()).match(/\$(-?[0-9]*)/)[1];
            if (value) {
                // I'm now ADDing the total
                // total = total + parseInt(value);
                total += parseInt(value);
            }
        });
        $('#total').html('$' + total);
    });
    $('input[name="BPSUBPT"]').click(function() {
        $(this).blur();
        $('#BPSUBPP').val($(this).val());
    });
    $('input[name="BPSUPQ"]').click(function() {
        $(this).blur();
        $('#BPSUDA').val($(this).val());
  });
        });
    </script>

Is there a way I can apply this to my java script.

 function updatePrice (el, priceLog, priceList) {
    priceLog.value = '$' + priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
}     
var colorPrices = {
        'yes' : $-100,
        'No' : $000,

    };

Answer 1

There are some details that I found here:

• "Yes$ -150 off" do not match with the regular expression /\$(-?[0-9]*)/, there is a space between $ and the sign.
• "Yes $-150 off" would match with that.
• ($(this).val()).match(/\$(-?[0-9]*)/)[1] -> there is only one group on your regular expression, so the [1] will not work.

This would work for you selecting by the value of the combo:

var colorPrices = {
    'yes' : -100,
    'No' : 000
};