changing the value of a variable when a radio button is clicked

Question

I know this is probably extremely simple to do but i cant't figure it out.All i need is for the value of the variable "price" to change when the radio button is click and for it to be displayed on the page.Thanks for the help.

This is placed in the head

<script>
var price = 500;
if (document.getElementById('wifi').checked) {
price = price + 200;
}
</script>

This is placed in the body of the html page

<input type="radio" name="wifi_price" id="wifi" value="200">Wifi Price</input>
<script>document.write(price);</script>

http://stackoverflow.com/a/13152970/3902127 – Tim Roberts Feb 25 '16 at 03:15 — Tim Roberts, Feb 25 '16 at 03:15

Jeff Diederiks · Answer 1 · 2016-02-25T03:52:59.467

<!DOCTYPE html>
<html>
        <head>
                <title>Checkbox Example</title>
                <meta name="viewport" content="width=device-width, initial-scale=1">
        </head>
        <body>
                <input type="radio" name="wifi_price" id="wifi" value="200">Wifi Price</input>
                <p id="priceP"></p>
                <script>
                        var priceP = document.getElementById('priceP');
                        priceP.innerHTML = "$100";
                        var wifi = document.getElementById('wifi');
                        wifi.addEventListener('click', function() {
                                var price = priceP.innerHTML.slice(1, priceP.innerHTML.length);
                                price = (price * 1) + 100;
                                priceP.innerHTML = "$" + price;
                        });
                </script>
        </body>
</html>

Im sorry i actually worded the question wrong i just realize it. so basically what I'm trying to do it i already have a number displayed on the website so for example $100 and when i click the radio button i just need that $100 to change to $200 — carrotcakewilly, Feb 25 '16 at 03:31

score 0 · Accepted Answer · answered Feb 25 '16 at 03:35

0

You should store your price variable in an object so that it can be easily accessed and updated.

<script>
window.onload = function(){
  var obj = {
    price: 500
  }
  var wifi = document.getElementById("wifi");
  wifi.addEventListener('click',function(){
    obj.price += parseFloat(wifi.value)
    // document.writeln(obj.price)
  })
}
</script>

answered Feb 25 '16 at 03:35

nick

1,197
11
16

Thanks for the help. It works exactly how it needed to. – carrotcakewilly Feb 25 '16 at 03:42

changing the value of a variable when a radio button is clicked

2 Answers2