check if a radio type input is selected on javascript

Question

hy

I have an issue. I have 4 radio type input, and i want them to be checked which one is selected on my JS function to show a different panel depends on this choice. My problem is when i have to write in my function, in the parameter, how to check if my radio input has been selected or not.

This is my current function (not working):

function function1(){
    if (document.getElementsByClassName("btn1").is(":checked")){
        document.getElementById('div2').style.height = '200px';
    }
    else{
        document.getElementById('div2').style.height = '0px';
    }
    }

<label><input class="btn1" type="radio" name="optradio">Option 1</label>
<label><input class="btn1" type="radio" name="optradio">Option 1</label>
<label><input class="btn1" type="radio" name="optradio">Option 1</label>
<label><input class="btn1" type="radio" name="optradio">Option 1</label>
<button id="btn" onClick="function1()">example 1</button>

suresh bambhaniya · Answer 1 · 2018-11-04T18:26:47.810

0

The getElementsByClassName() method returns a collection of all elements

like this?

 function function1(){
        if (document.getElementsByClassName("btn1")[0].checked){
            alert("first selected");
        }
        if (document.getElementsByClassName("btn1")[1].checked){
            alert("second selected");
        }
        if (document.getElementsByClassName("btn1")[2].checked){
            alert("third selected");
        }
        if (document.getElementsByClassName("btn1")[3].checked){
            alert("forth selected");
        }
   }

edited Nov 04 '18 at 18:26

answered Nov 04 '18 at 17:46

suresh bambhaniya

1,687
1
10
20

Thanks for your answer but it didn't work. – Mattia Nov 04 '18 at 17:57
can you share html of buttons – suresh bambhaniya Nov 04 '18 at 17:58
ok i've edited the first one post – Mattia Nov 04 '18 at 18:07
here document.getElementsByClassName("btn1")[0].checked is for first radio button so select first and check for other toycan use document.getElementsByClassName("btn1")[1].checked, increase index – suresh bambhaniya Nov 04 '18 at 18:11
1

ok, now it works, you've been very kind and patient, thanks a lot. – Mattia Nov 04 '18 at 18:35

check if a radio type input is selected on javascript

1 Answers1