How can I check which of the two radio button is checked in javascript/jquery?

Question

How can I check which of the two radio button is checked in javascript/jquery in order to get the value of the input considering the fact that, in the HTML, both of them are by default unchecked (no checked attribute is added)

<input type="radio" name="AS88" value="true" required>
<input type="radio" name="AS88" value="false">

The following code does not work:

var elements = document.getElementsByName("AS88");
for (var i=0, len=elements.length; i<len; ++i) {
    if (elements[i].checked) {
        alert(elements[i].value)
    } 
};

EDIT:

Solutions with :checked in jquery such as:

$('input[name="AS88"]:checked').val();

always return undefined

you have to capture it on `change()` event of the radio button. — Venkata Krishna, Dec 30 '13 at 15:20
Sounds like a timing issue. Are you sure you're not executing the code before those inputs exist? — Teemu, Dec 30 '13 at 15:24
the code is executed just before the submit so all the input already exist — GiGamma, Dec 30 '13 at 15:27
You say "both of them are by default unchecked", so unless the user actually clicks one of them both will remain in the unchecked state and your code (with or without jQuery) will not find a checked one. — nnnnnn, Dec 30 '13 at 15:31
I use **required** so the user is forced to select the option before the submit... — GiGamma, Dec 30 '13 at 15:37

score 7 · Accepted Answer · answered Dec 30 '13 at 15:20

7

use attribute selector along with :checked selector and .val() to get the value of the checked input element with name AS88

$('input[name="AS88"]:checked').val()

Demo: Fiddle

answered Dec 30 '13 at 15:20

Arun P Johny

384,651
66
527
531

This always returns **undefined** – GiGamma Dec 30 '13 at 15:22
@GigiGammino if none of the radios are checked then it will return undefined – Arun P Johny Dec 30 '13 at 15:23
@GigiGammino check the attached jsfiddle – Arun P Johny Dec 30 '13 at 15:25
it works fine on fiddle but the same code (except for the click function) returns undefined for me! – GiGamma Dec 30 '13 at 15:34
that means the selector `$('input[name="AS88"]:checked')` is wrong – Arun P Johny Dec 30 '13 at 15:40
@GigiGammino can you try an alert `alert($('input[name="AS88"]').length)` – Arun P Johny Dec 30 '13 at 15:41
the alert for the length returns 0 – GiGamma Dec 30 '13 at 15:45
@GigiGammino can you check the name of the radio buttons.. looks like it is not matching – Arun P Johny Dec 30 '13 at 15:56

How can I check which of the two radio button is checked in javascript/jquery?

1 Answers1