JAVASCRIPT - HOW TO Check if Radio Checked without Looping - Javascript Source Code

JAVASCRIPT - HOW TO Find Out if ANY Radio Button (within a group of radio buttons with the same name) has Been Checked

Most of the time, a radio button within a group of radio buttons is check or selected and is the default. Sometimes you don't want to make a default radio button selected.

The most commonly suggested way to see if ANY radio button, in a group of radio buttons with the same name, is checked is to loop through each of the radio buttons and testing to see if the radio button is checked ...

// ASSUMING WE HAVE A BUNCH OF RADIO BUTTONS WITH THE NAME [radioAgeRange] let arrRadios = document.getElementsByName('radioAgeRange'); for(let i = 0; i < arrRadios.length; i++){ if(arrRadios[i].checked){ // JAVASCRIPT CODE TO RUN IF THIS RADIO BUTTON IS CHECKED } }

A slightly shorten and less code intensive method of checking to see if ANY radio button, within a group of radio buttons, is checked ...

let checkRadio = document.querySelector('input[name="radioAgeRange"]:checked'); if(checkRadio != null){ alert(checkRadio.value); }

Since only one radio button, within a group of radio buttons, can be checked or selected, there is no need to run code for else other than for testing purposes.

Try Testing if ANY Radio Button is Selected

Here is a group of radio buttons. None of them are selected by default so this forces the visitor of your web page to make a selection of one of the radio buttons so we know the selection of a radio button is not merely because of oversight.

Select your age range:
18 - 29
30 - 44
45 - 59
60+
Which Radio Button Checked