How to Check Whether a Radio Button Is Selected With JavaScript

How to get value of selected radio button?

var rates = document.getElementById('rates').value;

The rates element is a div, so it won't have a value. This is probably where the undefined is coming from.

The checked property will tell you whether the element is selected:

if (document.getElementById('r1').checked) {
  rate_value = document.getElementById('r1').value;
}

Or

$("input[type='radio'][name='rate']:checked").val();

How can I check if a radio button is selected?

This should work!

<div class="radio-btn label">
    <label for="radio">Male</label>
    <input type="radio" name="radio" id="male" value="male">
    <label for="radio">Female</label>
    <input type="radio" name="radio" id="female" value="female">
</div>
<div id="gender-error" style="color: red; display: none">Please select the gender</div>
<button type="submit" onclick="return submit();">Submit</button>

<script>
    function submit() {
        var radios = document.getElementsByName("radio");
        var value = ""
        for (var i = 0, length = radios.length; i < length; i++) {
            if (radios[i].checked) {
                value = radios[i].value;
                break;
            }
        }

        document.getElementById("gender-error").style.display = !value ? "block" : "none";
        alert(value ? "selected " + value : "no value selected");
    }
</script>

Output:

JavaScript - Checking if Radio Button is selected

$(document).ready(function () {
    $('.smoking').on('change', function () {
        var radiosSmoking = document.getElementsByName('smoking');
        if (radiosSmoking[0].checked) {
            console.log('smoking checked')
        } else if (radiosSmoking[1].checked) {
            console.log('no smoking checked')
        }
    });
});

Fiddle Reference

Another Option:

 var radiosSmoking = document.getElementsByName('smoking');
    if (!(radiosSmoking[0].checked || radiosSmoking[1].checked)) {
        valid = false;
    }

Hope this helps.

Javascript check if one radio button is selected

!(payoo || paymd).checked will only check whether payoo is checked as the logical OR operator will return the first truthy value - since payoo is a dom element it will always return that

You need to check

if (!payoo.checked && !paymd.checked) {// if (!(payoo.checked || paymd.checked)) {
    var malchecks = document.getElementById("mallname");
    malchecks.checked = false;
    alert("Please select a payment method first");
}

How to check if only a radio button is selected using JavaScript?

Taken from Geeks For Geeks

Due to the nature of radio buttons, only one can be selected as long as the "name" attribute is the same between the buttons. To figure out which one is currently selected, you can get all of the elements with that name, and iterate over them, checking which value is true.

Example (vanilla javascript):

let ele = document.getElementsByName('Tractors'); 

for(let i = 0; i < ele.length; i++) { 
   if(ele[i].checked)  {
       console.log(`Pressed ${ele[i]}`);
   } 
}

Or using jQuery:

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

---

Related Topics