Pulling radio button values with Javascript

Question

I have a form on my webpage that looks like this:

<form id="numberForm">
<input type="radio" name="number" value="singular"> singular <br>
<input type="radio" name="number" value="plural"> plural <br>
</form>

How do I pull the value of the currently selected radio button (without a submit action) in Javascript?

What I'd like is something along the lines of the following:

var formInput = document.getElementById("numberForm");
var numberInputValue = formInput.SELECTEDBUTTON.value;

nelek · Accepted Answer · 2016-02-21 00:48:52Z

2

Try this (using querySelector in JS) :

function getSel() {
var formInput = document.getElementById("numberForm");
var rb=formInput.querySelector('[type="radio"]:checked'); //get selected radio button
document.getElementById('spVl').innerHTML = 'Selected value = '+rb.value;
}

<form id="numberForm">
<input type="radio" name="number" value="singular"> singular <br>
<input type="radio" name="number" value="plural"> plural <br>
<input type="button" value="Get selected radio button value" onclick="getSel();" /><br>
<span id="spVl"></span>
</form>

answered Feb 21, 2016 at 0:48

nelek

4,3423 gold badges25 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Matthew Herbst · Accepted Answer · 2016-02-21 00:46:11Z

0

var form = document.getElementById('numberForm');
var radios = form.getElementsByTagName('input');

for(var i = 0; i < radios.length; ++i) {
  if(radios[i].checked) {
    console.log("Radio button '" + radios[i].value + "' is checked");
  }
}

answered Feb 21, 2016 at 0:46

Matthew Herbst

32.3k27 gold badges92 silver badges141 bronze badges

Collectives™ on Stack Overflow

Pulling radio button values with Javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related