Target input by value

Question

I have 6 inputs in my HTML like this:

 <input type="radio" value="1" />
 <input type="radio" value="2" />
 <input type="radio" value="3" />
 <input type="radio" value="4" />
 <input type="radio" value="5" />
 <input type="submit" onClick="myFunction();" value="submit" />

When the submit button is clicked, a Javascript function is called. In this javascript function, I want to check which of the radio buttons is checked and which aren't.

Thanks in advance!

This question is already answered for JQuery: http://stackoverflow.com/questions/596351/how-can-i-get-which-radio-is-selected-via-jquery — Randy Jay Yarger, Oct 22 '14 at 20:26
Your radios have no `name` attribute - so all of these could be checked? — tymeJV, Oct 22 '14 at 20:30
@user3593846 Did any of below answers suits in your case? If yes please mark as correct or comment why it doesn't. — Alex Char, Oct 23 '14 at 13:40

elti musa · Accepted Answer · 2014-10-22T23:43:27.810

2

javascript

function myFunction() {
  var x = document.getElementsByTagName("input");
  for(i = 0; i < x.length; i++ ) {
    if(x[i].type = "radio") {
        if(x[i].checked) {
            alert(x[i].value);
        }
    }
  }
}

edited Oct 22 '14 at 23:43

answered Oct 22 '14 at 20:46

elti musa

710
2
7
14

score 1 · Answer 2 · answered Oct 22 '14 at 20:29

1

you can do it easily by jquery

 function myfunction(){
   $("input[type=radio]:checked").each(function(){

  //do something here


   });
    }

answered Oct 22 '14 at 20:29

A.B

20,110
3
37
71

1

Why not use a psuedo-selector instead of iterating over all elements? – Tristan Lee Oct 22 '14 at 20:29
1

edited, actually question was not clear, i thought persons wants to do somethingfor both cases if checked or if not – A.B Oct 22 '14 at 20:31
Good point. I just re-read it myself. :) Therefore your original solution may be more appropriate here. It just depends on if these radios are of the same group or not. – Tristan Lee Oct 22 '14 at 20:32
hmm, that i have removed now, lets hope it helps the user – A.B Oct 22 '14 at 20:34

score -2 · Answer 3 · answered Oct 22 '14 at 20:31

-2

You need to add a class first. this will ensure that you are not checking other radio elements in your page. See below.

<input type="radio" value="1" class='radio'/>
<input type="radio" value="2" class='radio'/>
<input type="radio" value="3" class='radio'/>
<input type="radio" value="4" class='radio'/>
<input type="radio" value="5" class='radio'/>
<input type="submit" onClick="myFunction();" value="submit" />

<!-- javascript- add script tags -->

function myFunction() {

    $('.radio').each(function() {

        if($(this).is(':checked')) { 
            alert("it's checked"); 
        }

    })

}

answered Oct 22 '14 at 20:31

Abhishek Saha

2,564
1
19
29

A class is not required here and adds more overhead in your solution. – Tristan Lee Oct 22 '14 at 20:34
1

But there might be other radios. It safe to group them with a class or wrap them inside a div. – Abhishek Saha Oct 22 '14 at 20:35
Radios are grouped with the `name` attribute. Even with a class, these still act as as checkboxes. – Tristan Lee Oct 22 '14 at 20:36
Do you really think it will create any overhead for what he is doing ? – Abhishek Saha Oct 22 '14 at 20:39

Target input by value

3 Answers3